@extends('layouts.admin-bloqueo-vista')

@section('titulo', 'Lista de medicamentos')

@section('css')
	<style type="text/css">
		th{cursor:pointer}
	</style>
@endsection

@section('botonera')
	<li class="form-group">
		@if(strstr(Auth::user()->permisos['medicamentos'], 'c') || Auth::user()->id == 1)
			<a href="{!! URL::to('/medicamento/create') !!}" class="btn btn-primary">Agregar un nuevo medicamento</a>
		@endif
	</li>
	<li class="form-group">
		<a href="{!! URL::to('/admin') !!}" class="btn btn-warning btn-right">Salir</a>
	</li>
@endsection
@section('content')
	@include('alerts.request')
	
	<div class="row">
		{!! Form::model($filtro, ['url' => '/medicamento', 'method' => 'GET']) !!}
		<div class="col-xs-2">
			<div class="form-group">
				{!! Form::label('cod') !!}
				{!! Form::text('cod', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por Código']) !!}
			</div>
		</div>
		<div class="col-xs-2">
			<div class="form-group">
				{!! Form::label('cum') !!}
				{!! Form::text('cum', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por CUM']) !!}
			</div>
		</div>
		<div class="col-xs-3">
			<div class="form-group">
				{!! Form::label('nombre') !!}
				{!! Form::text('nombre', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por Nombre']) !!}
			</div>
		</div>
		<div class="col-xs-3">
			<div class="form-group">
				{!! Form::label('forma_farmaceutica') !!}
				{!! Form::text('forma_farmaceutica', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por Forma Farmacéutica']) !!}
			</div>
		</div>
		<div class="col-xs-3">
			<div class="form-group">
				{!! Form::label('concentracion') !!}
				{!! Form::text('concentracion', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por Concentración']) !!}
			</div>
		</div>                                                                                                                                                                                                      
		<div class="col-xs-3">
			<div class="form-group">
				{!! Form::label('unidad_de_medida') !!}
				{!! Form::text('unidad_de_medida', null, ['class' => 'form-control input-sm', 'placeholder' => 'filtrar por Unidad']) !!}
			</div>
		</div>
		<br><br><br>
		<div class="col-xs-1">
			<div class="form-group">
				<button type="submit" class="btn btn-success">Filtrar</button>
			</div>
		</div>
		<div class="col-xs-11">
			@include('pagination.default', ['paginator' => $medicamentos])
		</div>
		{!! Form::close() !!}
	</div>

	<div class="row">
		<div class="col-xs-12">
			@if (count($medicamentos))
				<div class="table-responsive">
					<table id='tabla-medicamentos' class="table table-striped table-bordered table-hover table-condensed">
						@include('formularios.ajax-lista-medicamentos')
					</table>
				</div>
			@else
				<p>Ningún resultado encontrado.</p>
			@endif
		</div>
	</div>
@endsection
@section('scripts')
	<script type="text/javascript">
		$(document).ready(function(){
			// Ordenar la tabla de resultados
			var medicamentos = {!! json_encode($medicamentos->items()) !!};
			var ordenActual = { 
				'cod': false,
				'cum': true,
				'nombre': true,
				'forma_farmaceutica': true,
				'concentracion': true,
				'unidad_de_medida': true,
			};

			var sort_by = function(field, reverse, primer){
			   var key = primer ? 
			       function(x) {return primer(x[field])} : 
			       function(x) {return x[field]};

			   reverse = !reverse ? 1 : -1;

			   return function (a, b) {
			       return a = key(a), b = key(b), reverse * ((a > b) - (b > a));
			     } 
			}

			$('th').click(function () {
				var campo = $(this).attr('id');
				ordenActual[campo] = ordenActual[campo] ? false : true;

				// Cambiar la dirección de la flecha
				$('.glyphicon').removeClass('glyphicon-chevron-down glyphicon-chevron-up');
				$('th#' + campo + '>span').addClass('glyphicon-chevron-' + (ordenActual[campo] ? 'up' : 'down'));

				medicamentos = medicamentos.sort(sort_by(campo, ordenActual[campo], function(a){
					if(a != null ){return a.toUpperCase()};

						}))
				
				$('tbody').html('');

				medicamentos.map(function (item) {
					var tr = $('<tr/>');
					var deletedAndUpdateLink = $('<form/>', {
						method: 'POST',
						action: 'http://127.0.0.1:8080/clinica/public/medicamento/' + item.id_medicamento,
						'accept-charset': "UTF-8"
					});

					deletedAndUpdateLink.append($('<input/>', {
						name: "_method",
						type: "hidden",
						value: "DELETE"
					}));

					deletedAndUpdateLink.append($('<input/>', {
						name: "_token",
						type: "hidden",
						value: "{{ csrf_token() }}"
					}));

					deletedAndUpdateLink.append($('<a/>', {
						href: "http://127.0.0.1:8080/clinica/public/medicamento/" + item.id_medicamento + "/edit",
						class: "btn btn-primary btn-xs",
						html: "Editar",
						style: "margin-right: 4px;"
					}));

					deletedAndUpdateLink.append($('<input/>', {
						class: "btn btn-danger btn-xs",
						type: "submit",
						value: "Inhabilitar"
					}));

					tr.append($('<td/>').html(item.cod));
					tr.append($('<td/>').html(item.cum));
					tr.append($('<td/>').html(item.nombre));
					tr.append($('<td/>').html(item.forma_farmaceutica));
					tr.append($('<td/>').html(item.concentracion));
					tr.append($('<td/>').html(item.unidad_de_medida));
					tr.append($('<td/>').html(deletedAndUpdateLink));

					$('tbody').append(tr);
				});
			});

			@include('componentes.script-mostrar-modal-request');
		});
	</script>
@endsection