<!--<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>
	<modal-dialvox medium v-model="ingroupsModal" disabled cancel="Guardar y Cerrar" @closed="saveIngroups" >
		<?php include "modals" . DIRECTORY_SEPARATOR . "ingroups.php";?>
	</modal-dialvox>
	<modal-dialvox
		medium
		v-model="ingroupsRankModal"
		disabled
		cancel="Cerrar"
		send="Guardar"
		@submit="saveIngroupRank"
		:disabled="false"
	>
		<?php include "modals" . DIRECTORY_SEPARATOR . "ingroupRank.php";?>
	</modal-dialvox>
	<?php include "modals" . DIRECTORY_SEPARATOR . "file.php"; ?>
	<?php include "modals" . DIRECTORY_SEPARATOR . "campaigns.php"; ?>
	<div class="" style="margin-top: 75px;">
		<section id="content">
			<div id="spinnerCont"></div>
			<div class="barrita" id="barrita" style="position:absolute;left:0%;right:0%;z-index:10;top:30%;">
				<center><img src="<?=IMG_ADMIN;?>spinner.gif"></center>
			</div>
			<div id="barritaAlt">
				<center><img src="<?=IMG_ADMIN;?>spinner.gif"></center>
				<span class="caption">{{ traducirFrase("Espera un momento") }}</span>
			</div>

			<div class="container card-panel white">
				<div class="section">
					<div class="row">
						<div class="col s3">
							<input type='text' id='texto' class="form-control" v.bind:placeholder='traducirFrase("Busqueda")+"..."' v-on:keyup='pagina=1;recargar();'>
						</div>
					</div>
					<table class="table striped highlight responsive-table">
						<thead>
							<tr>
								<th>{{i18n.gettext("Usuario")}}</th>
								<th>{{i18n.gettext("Nombre")}}</th>
								<th>{{i18n.gettext("Nivel")}}</th>
								<?php
if ($_SESSION["Cliente"] == -1) {
    ?>
									<th>{{i18n.gettext("Cliente")}}</th>
								<?php }?>
								<th>{{i18n.gettext("Extensión")}}</th>
								<th>{{i18n.gettext("Opciones")}}</th>
								<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
									<th>{{i18n.gettext("Activo")}}</th>
								<?php }?>
								<?php if ($_SESSION["Grupo"] == GRUPO_SUPERVISORES) {?>
									<th>{{i18n.gettext("Activo")}}</th>
								<?php }?>
							</tr>
						</thead>
						<tbody id="cuerpoUsuarios">
							<tr v-for='user in databuffer'>
								<td>
									{{user.user}}
								</td>
								<td>
									{{user.full_name}}
								</td>
								<td>
									{{user.user_level}}
								</td>
								<?php if ($_SESSION["Cliente"] == -1) {?>
									<td>{{user.cliente}}</td>
								<?php }?>
								<td>
									{{user.extension.extension}}
								</td>
								<td>
									<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
										<a href='#' class="tooltipped" v-bind:data-tooltip="translate('Editar usuario')" data-position="top" v-on:click='abreModal(user.user)'><i class="material-icons">mode_edit</i></a>
										<a class="tooltipped" v-bind:data-tooltip="translate('Borrar usuario')" data-position="top" v-bind:href="'javascript:borrarUser(\''+user.user+ '\')'"><i class="material-icons">delete</i></a>
									<?php }?>
									<a class="tooltipped" v-bind:data-tooltip="translate('Expulsar usuario')" data-position="top" v-bind:href="'javascript:expulsarUsuario(\''+user.user+ '\')'"><i class="material-icons">file_upload</i></a>
									<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
										<a class="tooltipped" v-bind:data-tooltip="traducirFrase('Grupos de entrada')" data-position="top" href="#" @click="showIngroups(user)" v-if="user.user_level == 2"><i class="material-icons ">group_add</i></a>
										<!--  -->
										<a class="tooltipped" :data-tooltip="traducirFrase('Campañas para el usuario')" data-position="top" href="#" @click="openCampanasModal(user)" v-if="user.user_level == 2"><i class="material-icons ">assignment_ind</i></a>
										<!--  -->
										<a class="tooltipped" v-bind:data-tooltip="traducirFrase('Rango de grupos de entrada')" data-position="top" href="#" @click="openIngroupRank(user)" v-if="user.user_level == 2"><i class="material-icons ">grade</i></a>
									<?php }?>
									<a class="tooltipped" v-bind:data-tooltip="translate('Estadísticas de Usuario')" data-position="top" v-bind:href="'/Dialvox/index.php/usuarios/otro?Usuario='+user.user"><i class="material-icons">zoom_in</i></a>
									<a class="tooltipped" v-bind:data-tooltip="translate('Tomar posesion')" data-position="top" v-bind:href="'javascript:takePosseion(\''+user.user+'\','+user.user_level+','+user.extension.Nuevo+',\''+user.pass+'\')'"><i class="material-icons">remove_red_eye</i></a>
								</td>

								<?php if ($_SESSION["Grupo"] == GRUPO_SUPERVISORES) {?>
									<td>
										<div class="switch">
											<label class="active">
												Off
												<input disabled type="checkbox" class="" v-bind:checked='(user.active=="Y"?"checked":"")' v-on:click='changeUserPerron(user.user)'>
												<span class="lever  "></span>
												On
											</label>
										</div>
									</td>
								<?php }?>

								<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
									<td>
										<div class="switch">
											<label class="active">
												Off
												<input type="checkbox" class="" v-bind:checked='(user.active=="Y"?"checked":"")' v-on:click='changeUserPerron(user.user)'>
												<span class="lever  "></span>
												On
											</label>
										</div>
									</td>
								<?php }?>
							</tr>
						</tbody>
					</table>
				</div>
				<?php if ($_SESSION["Grupo"] == GRUPO_ADMINS) {?>
					<div style="display: flex; align-item: center; justify-content: center;">
						<a class="col waves-effect waves-light btn blue lighten-2" style="margin: 0px 5px;" href="javascript:app.abreModal('')">{{i18n.gettext("Nuevo Usuario")}}</a>
						<a class="col waves-effect waves-light btn blue lighten-2" style="margin: 0px 5px;" @click="modalFile = true" >
							{{traducirFrase("Cargar archivo")}}
						</a>
					</div>
				<?php }?>
				<ul class="pagination center" id='paginacion'>

				</ul>

				<br><br>
				<br><br>
			</div>

			<!--end container-->
		</section>
	</div>
	<div id='formuModal' class='modal card-panel' style="height: 100%; max-height:100%;  width:40%; margin-top:-40px;">
		<div class='modal-content'>
			<div class='row'>
				<h3 id='titulo'>{{i18n.gettext("Crear Usuario")}}</h3>
			</div>
			<div class='row'>
				<div class='col s12'>
					<div class='row'>
						<?php if ($_SESSION["Cliente"] != -1) {?>
							<div class='input-field col s12'>
								<h4 id='codigo'></h4>
								<input type='hidden' id='idShido' onkeypress="return validate(event, /[a-zA-Z0-9]/g, 15)" class="validate">
								<label for='idShido'>{{i18n.gettext("Nombre de Usuario")}}</label>
								<input type='hidden' id='cliente'>
								<input type='hidden' id='extLog'>
								<input type="hidden" id="idUsuario_wa">
							</div>
						<?php } else {?>
							<div class='input-field col s6'>
								<h4 id='codigo'></h4>
								<input type='hidden' id='idShido' onkeypress="return validate(event, /[a-zA-Z0-9]/, 15)" class="validate">
								<label for='idShido'>{{i18n.gettext("Nombre de Usuario")}}</label>
								<input type='hidden' id='cliente'>
								<input type='hidden' id='extLog'>
							</div>
							<div class='input-field col s6'>
								<select id='Clientes' class='browser-default'>
								</select>
								<label for='Clientes' class='active'>
									{{i18n.gettext("Cliente")}}
								</label>
							</div>
						<?php }?>
					</div>
					<div class='row'>
						<div class='input-field col s6'>
							<input required='required' type='text' id='Nombre' class='validate' placeholder='' autocomplete="new-password" onkeypress="return validate(event, /[a-zA-Z ]/g, 50, true)" class="validate">
							<label for='estado' class='active'>
								{{i18n.gettext("Nombre")}}
							</label>
						</div>
						<div class='input-field col s6'>
							<select id='grupo' onchange='analiza3()' class='browser-default'>
								<option value='<?=GRUPO_AGENTES;?>' selected='selected'>{{i18n.gettext("AGENTES")}}</option>
								<option value='<?=GRUPO_ADMINS;?>'>{{i18n.gettext("ADMIN")}}</option>
								<option value='<?=GRUPO_SUPERVISORES;?>'>{{i18n.gettext("SUPERVISORES")}}</option>
							</select>
							<label for='grupo' class='active'>
								{{i18n.gettext("Grupo")}}
							</label>
						</div>
					</div>
					<div class="row">
						<div id='analizar' class="input-field col s6">
							<select id='Categoria' class='browser-default'>
							</select>
							<label for="Categoria" class='active'>{{i18n.gettext("Categoría")}}</label>
						</div>

						<div class='input-field passinput col s6'>
							<input required='required' type='password' id='password' class='validate' placeholder='' autocomplete="new-password">
							<a href='javascript:ocultaroff()' id='ojito_off'><i class="material-icons">visibility</i></a>
							<a href='javascript:ocultar()' id='ojito'><i class="material-icons">visibility_off</i></a>
							<label for='password' class='active'>
								{{i18n.gettext("Contraseña")}}
							</label>
						</div>
						<div class='input-field col s6' id='Pregunta'>
							<div class="switch">
								<div id='otroTexto'>{{i18n.gettext("¿Desea que este usuario se logue por WebRTC?")}}</div><br>
								<label for='vieja' class='active'>
									No
									<input type="checkbox" onclick='analiza();' class="" id='vieja'>
									<span class="lever  "></span>
									{{traducirFrase("Si")}}
								</label>
							</div>
						</div>
						<div class='input-field col s6'>
							<div class="switch">
								<div id='textoExt'>{{i18n.gettext("¿Crear una extensión para el usuario?")}}</div><br>
								<label for='ext' class='active'>
									{{i18n.gettext("No")}}
									<input type="checkbox" onclick='analiza2();' class="" id='ext'>
									<span class="lever  "></span>
									{{i18n.gettext("Si")}}
								</label>
							</div>
						</div>
						<div class='input-field col s6'>
							<input required='required' type='password' id='ext_pass' class='validate' placeholder='' autocomplete="new-password">
							<a href='javascript:ocultaroff2()' id='ojito_off2'><i class="material-icons">visibility</i></a>
							<a href='javascript:ocultar2()' id='ojito2'><i class="material-icons">visibility_off</i></a>
							<label for='ext_pass' class='active'>
								{{i18n.gettext("Contraseña de extension")}}
							</label>
						</div>
					</div>
					<?php if (NEED_WA && $_SESSION['allow_waCli']) {?>
						<div class="row hidThis">
							<div class="col s11">
								<label>Permitir WhatsApp</label> <br> <br>
								<div class="switch">

									<label>
										No
										<input type="checkbox" id='allow_wa'>
										<span class="lever"></span>
										Si
									</label>


								</div>
							</div>
						</div>
					<?php }?>
					<div class='row'>
						<div class="col s12">
							<center>
								<!--<button class=" btn waves-effect waves-light modal-trigger" data-target="modalConfiguracionWa" type='button'>Configurar campaña de whatsapp
					<i class="material-icons right">settings_phone</i>
				</button> <br> <br>-->
								<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>
							</center>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="modalConfiguracionWa" class="modal">
		<div class="modal-content">
			<h5>Configuración de campaña para Whatsapp</h5>
			<div class="row">
				<div class="col s12 input-field">
					<label for="" class="active">Nombre</label>
					<input type="text">
				</div>
				<div class="col s6 input-field">
					<div class="row">
						<div class="col s12">
							<label for="" class="active">Usuario</label>
							<input type="text">
						</div>
					</div>
					<div class="row">
						<div class="col s12">
							<label for="" class="active">Password</label>
							<input type="text">
						</div>
					</div>
				</div>
				<div class="col s6 input-field">
					<div class="row">
						<div class="col s12">
							<label for="" class="active">Nivel</label>
							<select class="browser-default" name="" id="">
								<option value="">Nivel</option>
							</select>
						</div>
						<div class="row">
							<div class="col s12">
								<label for="" class="active">Cliente</label>
								<select class="browser-default" name="" id="">
									<option value="">Cliente</option>
								</select>
							</div>
						</div>

					</div>

				</div>
				<div class="modal-footer">
					<center>
						<button class="modal-close btn waves-effect waves-light" type='button'>Cancelar
							<i class="material-icons right">cancel</i>
						</button>
						<button class=" btn waves-effect waves-light" type='button'>Aceptar
							<i class="material-icons right">send</i>
						</button>
					</center>
				</div>
			</div>
		</div>
	</div>
	<!-- END CONTENT -->
	<!-- //////////////////////////////////////////////////////////////////////////// -->



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

	<!-- 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>
	<?php include UTILS_PATH . "requests.php";?>
	<?php include UTILS_PATH . "components" . DIRECTORY_SEPARATOR . "table.component.php";?>
	<?php include UTILS_PATH . "components" . DIRECTORY_SEPARATOR . "modal.component.php";?>
	<?php include UTILS_PATH . "components" . DIRECTORY_SEPARATOR . "pagination.component.php";?>
	<?php require_once "script.php";?>

	<script>
		document.getElementById("texto").placeholder = i18n.gettext("Busqueda") + "...";
	</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>