<!--<div class="col s6 offset-s3 valign-wrapper" id="barrita" style="">
	<div class="progress" >
		<div class="indeterminate"></div>
	</div>
</div>-->

<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START CONTENT -->

<div id="mainTwo" v-cloak>
	<div class="" style="margin-top: -60px;">
		<section id="content">
			<div id="barrita" style="position:absolute;left:0%;right:0%;top:30%;z-index:1999;">
				<center><img src="<?=IMG_ADMIN;?>spinner.gif"></center>
			</div>

			<div class="container card-panel white">
				<div class="">
					<h4>{{i18n.gettext("Estados de calificación")}}</h4>

					<label for='UWU'>{{i18n.gettext("Campaña")}}:</label>
					<select class='browser-default' v-model.lazy='campanaAct' id='UWU' style="width:180px;" v-on:change="spinnerRecargar">

						<option v-for='campana in campanas' v-bind:value='campana.campaign_id'>{{campana.campaign_name}}</option>
					</select>

					<table class="table striped highlight responsive-table">
						<thead>
							<tr>
								<th>{{i18n.gettext("Estatus")}}</th>
								<th>{{i18n.gettext("Descripción")}}</th>
								<th>{{i18n.gettext("Categoria")}}</th>
								<th>{{i18n.gettext("Registro marcable")}}</th>
								<th>{{i18n.gettext("Marcar siguiente numero alterno")}}</th>
								<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
									<th>{{i18n.gettext("Opciones")}}</th>
								<?php }?>
							</tr>
						</thead>
						<tbody>
							<tr v-for='estatus in databuffer'>
								<td>{{estatus.status}} </td>
								<td>{{estatus.status_name}} </td>
								<td>{{estatus.category}} </td>
								<td>
									<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
										<div class="switch">
											<label>

												<input type="checkbox" v-model="estatus.marcable" v-on:click="cambia(estatus.status)">
												<span class="lever"></span>

											</label>
										</div>
									<?php } else {?>
										{{estatus.marcable ? 'Si' : 'No' }}
									<?php }?>
								</td>
								<td>
									<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
										<div class="switch">
											<label>

												<input type="checkbox" v-model="estatus.siguiente" v-on:click="cambia2(estatus.status)">
												<span class="lever"></span>

											</label>
										</div>
									<?php } else {?>
										{{estatus.siguiente ? 'Si' : 'No' }}
									<?php }?>
								</td>
								<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
									<td>
										<a href="#" class="tooltipped" v-bind:data-tooltip="translate('Editar estado')" data-position="top" v-on:click="abreModal(estatus.status)"><i class="material-icons">edit</i></a>
										<a href="#" class="tooltipped" v-bind:data-tooltip="translate('Borrar estado')" data-position="top" v-on:click="borrarEstatus(estatus.status,estatus.status_name)"><i class="material-icons">delete</i></a>
									</td>
								<?php }?>
							</tr>
						</tbody>
					</table>
				</div>
				<br>
				<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
					<div class="center" id='botonCrear'>
						<a class="waves-effect waves-light btn blue lighten-2 " v-on:click='abreModal("")'>{{i18n.gettext("Nuevo estado de calificación")}}</a>
					</div>
				<?php }?>
				<ul class="pagination center" id='paginacion'>

				</ul>
				<br><br>
				<div class="center-align">
					<a class="btn" href="../campanas">{{i18n.gettext("Volver a campañas")}}</a>
				</div>

				<br><br>

			</div>
			<!--end container-->
		</section>
	</div>
	<div id='formuModal' class='modal' style="height: 80%; max-height:80%;  width:80%">
		<div class='modal-content'>
			<div class='row'>
				<h3 id='titulo'>{{i18n.gettext("Crear codigo de pausa")}}</h3>
			</div>
			<div class="row">
				<div class="col s2">
					<div class="input-field">
						<input maxlength='6' type="hidden" id="statusNuevo" />
						<label id='Hola' class="active">{{i18n.gettext("Código")}}</label>
					</div>
				</div>
				<div class="col s5">
					<div class="input-field">
						<label class="active">{{i18n.gettext("Descripción")}}</label>
						<input maxlength='30' type="text" id="descripcionNueva" />

					</div>
				</div>
				<div class="col s3">
					<div class="input-field">
						<select class='browser-default' id="categoriaNuevo">
							<option v-for='otro in categorias' v-bind:value='otro.vsc_id'>{{otro.vsc_name}}</option>
						</select>
						<label for='categoriaNuevo' class='active'>{{i18n.gettext("Categoría")}}</label>
					</div>
				</div>
				<div class="col s12">

					<table class="striped highlight centered">
						<thead>
							<tr>
								<th>{{i18n.gettext("Seleccionable por agente")}}</th>
								<th>{{i18n.gettext("Respuesta Humana")}}</th>
								<th>{{i18n.gettext("Promesa de objetivo")}}</th>
								<th>{{i18n.gettext("No llamar")}}</th>
								<th>{{i18n.gettext("Cliente contactado")}}</th>
								<th>{{i18n.gettext("Cliente interesado")}}</th>
								<th>{{i18n.gettext("Registro Trabajable")}}</th>
								<th>{{i18n.gettext("Volver a llamar al cliente")}}</th>
								<th>{{i18n.gettext("Objetivo Completado")}}</th>
								<th>{{i18n.gettext("Respuesta por Máquina")}}</th>
								<th>{{i18n.gettext("Agregar a lista negra especifica (Numero)")}}</th>
								<th>{{i18n.gettext("Agregar a lista negra especifica (Vendor lead code)")}}</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>
									<div class="switch">
										<label>
											<input type="checkbox" id="chkNuevo1">
											<span class="lever"></span>
										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica si el agente puede ver o no este estado de calificación al momento de calificar una llamada.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo2">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica si la llamada fue contestada por un humano.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo3">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica si el cliente hizo una promesa del objetivo que se busca (Ejemplo: Promesa de pago, promesa de venta).')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo4">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica que no hay que volver a llamar a este registro.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo5">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica que si se contacto al cliente.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo6">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica si el cliente esta interesado en el objetivo que la llamada propone.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo7">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica si el registro nos sirve para el objetivo que buscamos.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo8">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica que se tiene que llamar al cliente.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo9">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica que se cumplio el objetivo y que se termino de trabajar este registro.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo10">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="translate('Esta opcion indica que respondio una contestadora.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo11">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="traducirFrase('Esta opcion indica si el numero debe ser agregado a la lista negra por el telefono.')" data-position="top">info</i>
								</td>
								<td>
									<div class="switch">
										<label>

											<input type="checkbox" id="chkNuevo12">
											<span class="lever"></span>

										</label>
									</div>
									<i class="material-icons tooltipped" v-bind:data-tooltip="traducirFrase('Esta opcion indica si el numero debe ser agregado a la lista negra por el vendor lead code.')" data-position="top">info</i>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
			<div class='row'>
				<div class="col s8 offset-s2">
					<button class="modal-close btn waves-effect waves-light" type='button' id='CancelarCampa'>{{i18n.gettext("Cancelar")}}
						<i class="material-icons right">cancel</i>
					</button>
					<button class=" btn waves-effect waves-light" id='CrearCampa' type='button'>{{i18n.gettext("Crear")}}
						<i class="material-icons right">send</i>
					</button>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- END CONTENT -->
<!-- //////////////////////////////////////////////////////////////////////////// -->



<!-- END MAIN -->
<!-- //////////////////////////////////////////////////////////////////////////// -->
<!-- START FOOTER -->
<?php require_once UTILS_PATH . 'footer.php';?>
</div>
</div>

<!-- END FOOTER -->
<!-- ================================================
    Scripts
    ================================================ -->
<!-- jQuery Library -->
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>jquery-3.2.1.min.js"></script>
<!--materialize js-->
<script type="text/javascript" src="<?=JS_ADMIN;?>materialize.min.js"></script>
<!--scrollbar-->
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>perfect-scrollbar/perfect-scrollbar.min.js"></script>
<!-- chartjs -->
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>chartjs/chart.min.js"></script>
<!-- sparkline -->
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>sparkline/jquery.sparkline.min.js"></script>
<!-- google map api -->
<script type="text/javascript" src="<?=JS_ADMIN;?>maps.js"></script>
<!--jvectormap-->
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<script type="text/javascript" src="<?=VENDORS_ADMIN;?>jvectormap/vectormap-script.js"></script>
<!--google map-->

<!--plugins.js - Some Specific JS codes for Plugin Settings-->
<script type="text/javascript" src="<?=JS_ADMIN;?>plugins.js"></script>
<!--card-advanced.js - Page specific JS-->
<script type="text/javascript" src="<?=JS_ADMIN;?>scripts/dashboard-analytics.js"></script>
<!--custom-script.js - Add your own theme custom JS
    <script type="text/javascript" src="<?=JS_ADMIN;?>custom-script.js"></script>-->
<script src="<?=JS_ADMIN;?>vue.js"></script>
<script src="<?=JS_ADMIN;?>Chart.min.js"></script>
<script src="<?=JS_ADMIN;?>gauge.min.js"></script>
<script src="<?=JS_ADMIN;?>raphael.js"></script>
<script src="<?=JS_ADMIN;?>justgage.js"></script>
<script src="<?=LIB_JS;?>sweetalert2.js" type="text/javascript"></script>


<script>
	var a = document.getElementById('idioma');
	if (a.value == "es") {
		<?php if (defined("BANDERA_ES")) {?>
			document.getElementById('banderaPais').innerHTML = '<span class="flag-icon flag-icon-<?php echo BANDERA_ES; ?>"></span>&nbsp;';
		<?php } else {?>
			document.getElementById('banderaPais').innerHTML = '<span class="flag-icon flag-icon-mx"></span>&nbsp;';
		<?php }?>

	} else {

		document.getElementById('banderaPais').innerHTML = '<span class="flag-icon flag-icon-um"></span>&nbsp;';

	}

	var flagBar = false;
	var app = new Vue({
		el: '#main',
		data: {
			categorias: [],
			flagOtro: true,
			databuffer: {},
			flagRecargar: true,
			pagina: 1,
			campanaAct: '',
			campanas: [],
			i18n: i18n
		},
		mounted: function() {
			$('.tooltipped').tooltip();
			var bla;
			$("#escondeme").hide();

			function cambiarAOscuro() {

				for (let i = 0; i < bla.length; i++) {
					bla[i].classList.remove('white');
					bla[i].classList.add('grey');
					bla[i].classList.add('lighten-1');
					bla[i].style.filter = 'invert(100%)';
				}
				document.getElementById('barrita').style.filter = "invert(100%)"
			}

			if (localStorage.getItem('background') == "black") {
				bla = document.getElementsByClassName('card-panel')
				bla = Array.prototype.slice.call(bla)
				cambiarAOscuro();
			}
			$("#escondeme").hide();
			$(".modal").modal();
			$("#barrita").show();
			this.cargarCampanas();
			this.recargar();
		},
		methods: {
			spinnerRecargar: function() {
				flagBar = !flagBar;
				cambiaPagina(1);
			},
			deten: function() {
				app.flagRecargar = false;
			},
			continua: function() {
				app.flagRecargar = true;
			},
			translate(texto) {
				if (i18n) return i18n.gettext(texto)
			},
			nivelMod: function() {
				return parseFloat(this.nivel).toFixed(2);
			},
			parseMembers: function(json) {
				var arr = [];
				for (var key in json) {
					if (json.hasOwnProperty(key)) {
						var val = json[key];
						arr.push(val);
					}
				}
				arr.pop();
				return arr;
			},
			cargarCampanas: function() {


				$.ajax({
					url: "<?=MODULOS;?>campanas/getCampaignsSelect",
					type: "POST",
					dataType: "text",
					error: function(data) {
						console.log(data);
					},
					success: function(response) {
						var res = JSON.parse(response);
						if (res.Estado == 'ok') {
							app.campanas = res.Campanas;



						} else {
							M.toast({
								'html': res.Descripcion
							});
						}
					}
				});
			},
			cargaCategorias: function() {

				$.ajax({
					url: "<?=MODULOS;?>categorias/getCategoriesSelect",
					type: "POST",
					dataType: "text",
					success: function(response) {
						var res = JSON.parse(response);
						if (res.Estado == 'ok') {
							app.categorias = res.Registros;
							var Arreglo = $('select');
							for (var i = 0; i < Arreglo.length; i++) {
								if (Arreglo[i].id != '') {
									$("#" + Arreglo[i].id).formSelect();
								}
							}


						} else {
							<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
								M.toast({
									html: res.Descripcion
								});
							<?php }?>
						}
						$('select').formSelect();
						M.updateTextFields();

					},
					error: function(data) {
						console.log(data);
					}
				});
			},
			abreModal: function(id) {
				if (id == '') {
					$("#Hola").show();
					$("#titulo").html(i18n.gettext("Estados de calificación"));
					document.getElementById('statusNuevo').value = '';
					$("#statusNuevo").attr("type", "text");
					document.getElementById('descripcionNueva').value = '';
					document.getElementById('chkNuevo1').checked = false;
					document.getElementById('chkNuevo2').checked = false;
					document.getElementById('categoriaNuevo').value
					document.getElementById('chkNuevo3').checked = false;
					document.getElementById('chkNuevo4').checked = false;
					document.getElementById('chkNuevo5').checked = false;
					document.getElementById('chkNuevo6').checked = false;
					document.getElementById('chkNuevo7').checked = false;
					document.getElementById('chkNuevo8').checked = false;
					document.getElementById('chkNuevo9').checked = false;
					document.getElementById('chkNuevo10').checked = false;
					document.getElementById('chkNuevo11').checked = false;
					document.getElementById('chkNuevo12').checked = false;
					$("#CrearCampa").html(i18n.gettext("Crear estados de calificación"));
					document.getElementById("CrearCampa").onclick = crearEstatus;
					setTimeout(() => {
						$('select').formSelect();
						M.updateTextFields();
					}, 100);
				} else {
					var Elem = this.databuffer.find(function(elem) {
						if (elem.status == id) {
							return true;
						}
						return false;
					});
					if (Elem.sistema) {
						M.toast({
							html: traducirFrase('Este estado de calificación no se puede editar')
						});
						return;
					} else {
						$("#Hola").hide();
						$("#titulo").html(Elem.status);
						document.getElementById('statusNuevo').value = Elem.status;
						$("#statusNuevo").attr("type", "hidden");
						document.getElementById('descripcionNueva').value = Elem.status_name;
						document.getElementById('chkNuevo1').checked = Elem.selectable;
						document.getElementById('chkNuevo2').checked = Elem.human_answered;
						document.getElementById('categoriaNuevo').value = Elem.category;
						document.getElementById('chkNuevo3').checked = Elem.sale;
						document.getElementById('chkNuevo4').checked = Elem.dnc;
						document.getElementById('chkNuevo5').checked = Elem.customer_contact;
						document.getElementById('chkNuevo6').checked = Elem.not_interested;
						document.getElementById('chkNuevo7').checked = Elem.unworkable;
						document.getElementById('chkNuevo8').checked = Elem.scheduled_callback;
						document.getElementById('chkNuevo9').checked = Elem.completed;
						document.getElementById('chkNuevo10').checked = Elem.answering_machine;
						document.getElementById('chkNuevo11').checked = Elem.blackPhone == 1;
						document.getElementById('chkNuevo12').checked = Elem.blackLead == 1;
						$("#CrearCampa").html(traducirFrase("Editar estados de calificación"));
						document.getElementById("CrearCampa").onclick = modificarEstatus;
						setTimeout(() => {
							$('select').formSelect();
							M.updateTextFields();
						}, 100);
					}
				}
				$("#formuModal").modal("open");
				setTimeout(() => {
					$('select').formSelect();
					M.updateTextFields();
				}, 100);
				var bla;

				function cambiarAOscuro() {

					for (let i = 0; i < bla.length; i++) {
						bla[i].classList.remove('white');
						bla[i].classList.add('grey');
						bla[i].classList.add('lighten-1');
						bla[i].style.filter = 'invert(100%)';
					}
				}

				if (localStorage.getItem('background') == "black") {
					bla = document.getElementsByClassName('card-panel')
					bla = Array.prototype.slice.call(bla)
					cambiarAOscuro();
				}
				$("#escondeme").hide();
			},
			cambia: function(id) {
				let elem = app.databuffer.find(val => {
					return val.status === id;
				});
				if (!elem)
					elem.dnc = false;
				if ((elem.dnc == true || elem.blackPhone == 1 || elem.blackLead == 1) && !elem.marcable) {
					app.recargar();

					M.toast({
						html: traducirFrase("No se puede poner un registro marcable que es tiene DNC")
					});
					M.updateTextFields();

				} else {
					var parametros = {
						status: id,
						campana: app.campanaAct
					};
					$.ajax({
						url: "<?=MODULOS;?>Campanas/changeDialStatus",
						type: "POST",
						dataType: "text",
						data: parametros,
						success: function(response) {
							var res = JSON.parse(response);
							if (res.Estado == 'ok') {
								M.toast({
									html: traducirFrase("El estado de calificación ha sido actualizado")
								});
								app.recargar();
							} else {
								M.toast({
									html: res.Descripcion
								});
							}
							$('select').formSelect();
							M.updateTextFields();

						},
						error: function(data) {
							console.log(data);
						}
					});
				}
			},
			cambia2: function(id) {
				var parametros = {
					status: id,
					campana: app.campanaAct
				};
				$.ajax({
					url: "<?=MODULOS;?>Campanas/changeAltStatus",
					type: "POST",
					dataType: "text",
					data: parametros,
					success: function(response) {
						var res = JSON.parse(response);
						if (res.Estado == 'ok') {
							M.toast({
								html: traducirFrase("El estado de calificación ha sido actualizado")
							});
						} else {
							M.toast({
								html: res.Descripcion
							});
						}
						$('select').formSelect();
						M.updateTextFields();

					},
					error: function(data) {
						console.log(data);
					}
				});
			},
			borrarEstatus: function(id, nombre) {
				var Elem = this.databuffer.find(function(val) {
					return val.status == id;
				});
				if (!Elem.sistema) {
					Swal.fire({
						type: 'warning',
						title: traducirFrase('Eliminar estado de calificacion'),
						text: traducirFrase('¿Desea borrar estado de calificacion: ') + id + '-' + nombre + '? \n'+traducirFrase('Esta acción no se puede deshacer'),
						showCancelButton: true,
						confirmButtonColor: '#3085d6',
						cancelButtonColor: '#d33',
						confirmButtonText: 'Si',
						cancelButtonText: "Cancelar",
						preConfirm: () => {
							$.ajax({
								url: "<?=MODULOS;?>campanas/deleteStatus",
								type: "POST",
								data: {
									campana: app.campanaAct,
									status: id
								},
								dataType: "text",
								error: function(data) {
									console.log(data);
								},
								success: function(response) {
									var res = JSON.parse(response);
									if (res.Estado == 'ok') {
										M.toast({
											'html': traducirFrase("Codigo de calificación borrado")
										});
										app.recargar();
									} else {
										M.toast({
											'html': res.Descripcion
										});
									}
								}
							});
						}
					});
				} else {

					M.toast({
						html: traducirFrase('Este estado de calificación no se puede borrar')
					});
				}

			},
			recargar: function() {
				if (flagBar) {
					$('#barrita').show();
				}

				if (app.flagRecargar) {
					if (app.flagOtro) {
						app.flagOtro = false;
						var url_string = window.location.href;
						var url = new URL(url_string);
						app.campanaAct = url.searchParams.get("campana");
						if (app.campanaAct == null) {
							app.campanaAct = "";
						}
					}
					var parametros = {
						pagina: app.pagina,
						campana: app.campanaAct
					};
					$.ajax({
						url: "<?=MODULOS;?>campanas/getStatuses",
						type: "POST",
						data: parametros,
						dataType: "text",
						success: function(response) {
							var res = JSON.parse(response);
							if (res.Estado == 'ok') {
								app.databuffer = res.Registros;
								app.cargaCategorias();
								app.databuffer = res.Registros;
								for (var i = 0; i < app.databuffer.length; i++) {
									app.databuffer[i].selectable = app.databuffer[i].selectable == 'Y' ? true : false;
									app.databuffer[i].human_answered = app.databuffer[i].human_answered == 'Y' ? true : false;
									app.databuffer[i].sale = app.databuffer[i].sale == 'Y' ? true : false;
									app.databuffer[i].dnc = app.databuffer[i].dnc == 'Y' ? true : false;
									app.databuffer[i].customer_contact = app.databuffer[i].customer_contact == 'Y' ? true : false;
									app.databuffer[i].not_interested = app.databuffer[i].not_interested !== 'Y' ? true : false;
									app.databuffer[i].unworkable = app.databuffer[i].unworkable !== 'Y' ? true : false;
									app.databuffer[i].scheduled_callback = app.databuffer[i].scheduled_callback == 'Y' ? true : false;
									app.databuffer[i].completed = app.databuffer[i].completed == 'Y' ? true : false;
									app.databuffer[i].sistema = app.databuffer[i].propios == 'sistema' ? true : false;
									app.databuffer[i].marcable = app.databuffer[i].marcable == 'Y' ? true : false;
									app.databuffer[i].siguiente = app.databuffer[i].siguiente == 'Y' ? true : false;
									app.databuffer[i].answering_machine = app.databuffer[i].answering_machine == "Y" ? true : false;
								}
								var Arreglo = $('select');
								for (var i = 0; i < Arreglo.length; i++) {
									if (Arreglo[i].id != '') {
										$("#" + Arreglo[i].id).formSelect();
									}
								}
								$("#paginacion").html("");
								var Anterior = res.Cuenta;
								res.Cuenta /= 10;
								res.Cuenta = Math.floor(res.Cuenta);
								if (Anterior % 10 != 0) {
									res.Cuenta++;
								}
								if (app.pagina == 1) {
									$("#paginacion").append(
										"<li class='disabled'><a href='#!'><i class='material-icons'>chevron_left</i></a></li>");
								} else {
									$("#paginacion").append("<li class='waves-effect'><a href='javascript:cambiaPagina(" + (app.pagina - 1) +
										")'><i class='material-icons'>chevron_left</i></a></li>");
								}
								for (var i = 0; i < res.Cuenta; i++) {
									if (app.pagina == (i + 1)) {
										$("#paginacion").append("<li class='active blue lighten-2 '><a href='javascript:cambiaPagina(" + (i + 1) +
											")'>" + (i + 1) + "</a></li>");
									} else {
										$("#paginacion").append("<li class='waves-effect'><a href='javascript:cambiaPagina(" + (i + 1) + ")'>" +
											(i +
												1) + "</a></li>");
									}
								}
								if (app.pagina == res.Cuenta || res.Cuenta == 0) {
									$("#paginacion").append(
										"<li class='disabled'><a href='#!'><i class='material-icons'>chevron_right</i></a></li>");
								} else {
									$("#paginacion").append("<li class='waves-effect'><a href='javascript:cambiaPagina(" + (app.pagina + 1) +
										")'><i class='material-icons'>chevron_right</i></a></li>");
								}
								setTimeout(() => {
									$('select').formSelect();
									M.updateTextFields();
								}, 100);
								setTimeout(() => {
									$('.tooltipped').tooltip();
								}, 1000);
								if (flagBar) {
									flagBar = !flagBar;
								}
								$('#barrita').hide();

							} else {
								M.toast({
									'html': res.Descripcion
								});
							}
						},
						error: function(data) {
							console.log(data);
						}
					});
					var bla;

					function cambiarAOscuro() {

						for (let i = 0; i < bla.length; i++) {
							bla[i].classList.remove('white');
							bla[i].classList.add('grey');
							bla[i].classList.add('lighten-1');
							bla[i].style.filter = 'invert(100%)';
						}
					}

					if (localStorage.getItem('background') == "black") {
						bla = document.getElementsByClassName('card-panel')
						bla = Array.prototype.slice.call(bla)
						cambiarAOscuro();
					}
					$("#escondeme").hide();
				}
			}
		},
		created: function() {
			M.toast({
				html: traducirFrase("Cargando datos, por favor espere") + "."
			});
			var bla;

			function cambiarAOscuro() {

				for (let i = 0; i < bla.length; i++) {
					bla[i].classList.remove('white');
					bla[i].classList.add('grey');
					bla[i].classList.add('lighten-1');
					bla[i].style.filter = 'invert(100%)';
				}
			}

			if (localStorage.getItem('background') == "black") {
				bla = document.getElementsByClassName('card-panel')
				bla = Array.prototype.slice.call(bla)
				cambiarAOscuro();
			}
			$("#escondeme").hide();

			$('.fixed-action-btn').floatingActionButton();
			setTimeout(() => {
				$('select').formSelect();
				M.updateTextFields();
			}, 100);

			this.recargar();
			this.cargarCampanas();
		},
		computed: {
			classObject: function() {
				if (this.ls == 'white') {
					return 'black-text';
				} else {
					return 'white-text';
				}
			}
		}
	});
	app.recargar();
	app.cargarCampanas();
	setInterval(function() {
		app.recargar();
	}, 30000);
	setInterval(function() {
		app.cargarCampanas();
	}, 120000);

	function cambiaPagina(pag) {
		app.pagina = pag;
		app.recargar();
	}

	function crearEstatus() {
		$('#barrita').show();
		var parametros = {
			campana: app.campanaAct,
			status: document.getElementById('statusNuevo').value,
			nombre: document.getElementById('descripcionNueva').value,
			seleccionable: (document.getElementById('chkNuevo1').checked) ? "Y" : "N",
			human: (document.getElementById('chkNuevo2').checked) ? "Y" : "N",
			categoria: document.getElementById('categoriaNuevo').value,
			sale: (document.getElementById('chkNuevo3').checked) ? "Y" : "N",
			dnc: (document.getElementById('chkNuevo4').checked) ? "Y" : "N",
			cc: (document.getElementById('chkNuevo5').checked) ? "Y" : "N",
			ni: (!document.getElementById('chkNuevo6').checked) ? "Y" : "N",
			unwork: (!document.getElementById('chkNuevo7').checked) ? "Y" : "N",
			callback: (document.getElementById('chkNuevo8').checked) ? "Y" : "N",
			limpia: (document.getElementById('chkNuevo9').checked) ? "Y" : "N",
			answering_machine: (document.getElementById('chkNuevo10').checked) ? "Y" : "N",
			blackPhone: (document.getElementById('chkNuevo11').checked) ? "1" : "0",
			blackLead: (document.getElementById('chkNuevo12').checked) ? "1" : "0",
		};
		$.ajax({
			url: "<?=MODULOS;?>campanas/addStatus",
			type: "POST",
			data: parametros,
			dataType: "text",
			success: function(response) {
				var resp = JSON.parse(response);
				if (resp.Estado == 'ok') {
					M.toast({
						'html': traducirFrase("Se creo el estatus")
					});
					$("#formuModal").modal("close");
				} else {
					M.toast({
						'html': resp.Descripcion
					});
				}
				setTimeout(() => {
					$('select').formSelect();
					M.updateTextFields();
					$('#barrita').hide();
				}, 100);
			},
			error: function(data) {
				console.log(data);
				M.toast({
					'html': traducirFrase('Error en comunicacion al servidor')
				});
			}
		});
	}

	function modificarEstatus() {
		$('#barrita').show();
		var parametros = {
			campana: app.campanaAct,
			status: document.getElementById('statusNuevo').value,
			nombre: document.getElementById('descripcionNueva').value,
			seleccionable: (document.getElementById('chkNuevo1').checked) ? "Y" : "N",
			human: (document.getElementById('chkNuevo2').checked) ? "Y" : "N",
			categoria: document.getElementById('categoriaNuevo').value,
			sale: (document.getElementById('chkNuevo3').checked) ? "Y" : "N",
			dnc: (document.getElementById('chkNuevo4').checked) ? "Y" : "N",
			cc: (document.getElementById('chkNuevo5').checked) ? "Y" : "N",
			ni: (!document.getElementById('chkNuevo6').checked) ? "Y" : "N",
			unwork: (!document.getElementById('chkNuevo7').checked) ? "Y" : "N",
			callback: (document.getElementById('chkNuevo8').checked) ? "Y" : "N",
			limpia: (document.getElementById('chkNuevo9').checked) ? "Y" : "N",
			answering_machine: (document.getElementById('chkNuevo10').checked) ? "Y" : "N",
			blackPhone: (document.getElementById('chkNuevo11').checked) ? "1" : "0",
			blackLead: (document.getElementById('chkNuevo12').checked) ? "1" : "0",
		};
		$.ajax({
			url: "<?=MODULOS;?>campanas/editStatus",
			type: "POST",
			data: parametros,
			dataType: "text",
			success: function(response) {
				var resp = JSON.parse(response);
				if (resp.Estado == 'ok') {
					app.recargar();
					$('#barrita').hide();
					M.toast({
						'html': traducirFrase("Se modifico el estatus")
					});
					let statusId = parametros.status;
					let elem = app.databuffer.find(el => {
						return el.status === statusId;
					})
					if (elem && elem.marcable && parametros.dnc === "Y") {
						app.cambia(elem.status)
					}
				} else {
					M.toast({
						'html': resp.Descripcion
					});
				}
				$("#formuModal").modal("close");
			},
			error: function(data) {
				console.log(data);
			}
		});
	}
</script>

</body>

<!-- Mirrored from pixinvent.com/materialize-material-design-admin-template/html/horizontal-menu/ by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 07 Aug 2018 16:55:15 GMT -->

</html>