@extends('BaseSistemaWeb')

@section('CSS')
{{ HTML::style('DataTables/dataTables.bootstrap.min.css') }}
{{ HTML::style('DataTables/responsive.dataTables.min.css') }}
{{ HTML::style('bootstrap-daterangepicker/daterangepicker.css') }}
{{ HTML::style('Intl-Tel-Input/17.0.3/css/intlTelInput.min.css') }}
{{ HTML::style('bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css') }}
{{ HTML::style('bootstrap-select/css/bootstrap-select.min.css') }}
{{ HTML::style('DataTables/fixedHeader.dataTables.min.css') }}
<style type="text/css">
	@media (max-width: 450px) { .ModalEliminar .modal-dialog { width: auto; } }
	@media (min-width: 451px) { .ModalEliminar .modal-dialog { width: 450px; } }
	.progress {
		position: relative;
	}
	.progress span {
		position: absolute;
		display: block;
		width: 100%;
		color: black;
	}
	.table > tbody > tr.success > td {
		background-color: #b4ef9d;
	}
	.table > tbody > tr.success:hover > td {
		background-color: #9fec82;
	}
	.table > tbody > tr.info > td {
		background-color: #b1dff6;
	}
	.table > tbody > tr.info:hover > td {
		background-color: #95d6f6;
	}
	.table > tbody > tr.warning > td {
		background-color: #f5e8a5;
	}
	.table-hover > tbody > tr.warning:hover > td {
		background-color: #f5e490;
	}
	.table > tbody > tr.danger > td {
		background-color: #f6b9b9;
	}
	.table > tbody > tr.danger:hover > td {
		background-color: #f89494;
	}
	.table-bordered {
		border: 1px solid #7a7a7a;
	}
	.table-bordered > thead > tr > th {
		border: 1px solid #7a7a7a;
	}
	.table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
		border: 1px solid #7a7a7a;
	}
	.country-list {
		z-index: 10000 !important;
		/* position: fixed !important; */
	}
	.intl-tel-input input[type="text"] {
		padding-left: 52px !important;
	}
	.intl-tel-input {
		width: 100%;
		display: block !important;
	}
	.intl-tel-input .iti-flag .arrow {
		border: none;
	}
	.bootstrap-select.form-control:not([class*="col-"]) {
		width: unset !important;
	}
	table.table.fixedHeader-floating {
		top: 35px !important;
		z-index: 99;
	}
	.intl-tel-input, .iti {
		height: 34px !important;
		width: 100%;
		/*display: table-cell;*/
	}
	.mdAvatar .modal-dialog .modal-content .modal-header, .modalCrearVenta .modal-dialog .modal-content .modal-header {
		background-color: #363B3F;
	}
	.mdAvatar .modal-dialog .modal-content .bootstrap-dialog-title{
		display: block;
	}
	.modalCrearVenta .bootstrap-select.form-control:not([class*="col-"]){
		width: 100% !important;
	}
	.dvEnvio{
		display: flex;
    	justify-content: space-around;
	}
	.datos {
		width: 49.5%;
	}
	.desactivado {
		opacity: 0.5;
		pointer-events: none;
		display: none;
	}
	#frmPaso4 .radio-inline + span{
		display: block;
	}
	.btn-aplicar {
		background: #428BCA;
		color: white;
	}
	.btn-aplicar:hover {
		background: #3276B1;
		color: white;
	}
	.btn-aplicar:focus {
		color: white;
	}
	.product-selection-view {
		display: none;
	}
</style>
@stop

@section('Contenido')
<div class="row">
	<div class="col-md-12">
		<h2><i class="fa fa-shopping-cart"></i> Gestión de ventas en línea </h2>
	</div><!--/col-md-12-->
</div><!--/row-->

<div class="row">
	<div class="col-md-12">
		@if (Session::has('message'))
		<div class="alert alert-info">{{ Session::get('message') }}</div>
		@endif
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="block-web">
			<div class="header">
				<h3 class="content-header">
					Listado de ventas realizadas
					<button type="button" class="btn btn-primary btn-agregar"  style="border-radius: 3px;">Agregar venta</button>
					<div data-toggle="buttons" class="button-group pull-right">
						<a class="refresh tooltips" data-toggle="tooltip" data-original-title="Actualizar registros" onclick="Actualizar()" href="javascript:Actualizar()" style="color: rgba(0, 0, 0, 0.3)">
							<i class="fa fa-repeat"> </i>
						</a>
					</div>
				</h3>
			</div>
			<div class="porlets-content">
				<form id="frmFiltroFechas" class="form-inline" style="padding-bottom: 15px;">
					<div class="form-group">
						<label for="FiltroFechas" style="padding-top: 10px;"> Fecha: </label>
						<input id="FiltroFechas" type="text" name="filtrofechas" value="" readonly>
					</div>
					<div class="form-group">
						<label for="slEstadoPedido" style="/*padding-top: 10px;*/"> Estados: </label>
						<select class="form-control selectpicker" name="slEstadoPedido" multiple data-selected-text-format="count > 5">
							<option selected value="PENV"> Pendiente de envío </option>
							<option selected value="E"> Enviado </option>
							<option selected value="R"> Recibido </option>
							<option selected value="RP"> Retorno de producto </option>
							<option selected value="DD"> Devolución de dinero </option>
							<option selected value="RPDD"> Retorno y devolución </option>
							<option selected value="F"> Finalizada </option>
							<option selected value="PENT"> Pendiente de entrega </option>
							<option selected value="PEND"> Pendiente de descarga </option>
							<option selected value="PEVI"> Pendiente de visto </option>
							<option selected value="PENU"> Pendiente de usar </option>
							<option selected value="USAD"> Usado </option>
							<option selected value="PP"> Pendiente de pago </option>
							<option selected value="CPE"> Cancelado por pago en efectivo </option>
						</select>
					</div>
					<button type="submit" class="btn btn-primary tooltips" data-toggle="tooltip" data-original-title="Buscar"><i class="fa fa-search"></i></button>
					<button id="btnLimpiar" type="button" class="btn btn-default tooltips" data-toggle="tooltip" data-original-title="Limpiar"><i class="fa fa-paint-brush"></i></button>
				</form>
				<div class="table-responsive">
					<table class="table table-striped table-bordered table-hover" id="tblVentasRealizadas">
						<thead>
							<tr>
								<th class="text-center" style="width: 9%;"> Fecha </th>
								<th class="text-center"> Número de seguimiento </th>
								<th class="text-center"> Número de orden </th>
								<th class="text-center"> Información de comprador </th>
								<th class="text-center"> Correo de comprador </th>
								<th class="text-center"> Telefono de comprador </th>
								<th class="text-center"> Nombre de comprador </th>
								<th class="text-center"> Información de envío </th>
								<th class="text-center" style=""> Información del pedido </th>
								<th class="text-center" style=""> Estado del pedido </th>
								<th class="text-center" style=""> Acciones </th>
							</tr>
							<!-- <tr>
								<th> Fecha </th>
								<th> Número de seguimiento </th>
								<th> Número de orden </th>
								<th> Información de comprador </th>
								<th> Información de envío </th>
								<th> Información del pedido </th>
								<th> Estado del pedido </th>
								<th> Acciones </th>
							</tr> -->
						</thead>
						<!-- <tfoot>
							<tr>
								<th> Fecha </th>
								<th> Número de seguimiento </th>
								<th> Número de orden </th>
								<th> Información de comprador </th>
								<th> Información de envío </th>
								<th> Información del pedido </th>
								<th> Estado del pedido </th>
								<th> Acciones </th>
							</tr>
						</tfoot> -->
					</table>
				</div>
				<div class="footer">
					<button type="button" class="btn btn-primary btn-agregar">Agregar venta</button>
				</div>
			</div>
		</div>
	</div>
</div><!--/row end-->
@stop

@section('JS')
{{ HTML::script('DataTables/jquery.dataTables.min.js') }}
{{ HTML::script('DataTables/dataTables.bootstrap.min.js') }}
{{ HTML::script('DataTables/dataTables.responsive.min.js') }}
{{ HTML::script('bootstrap-daterangepicker/moment.min.js') }}
{{ HTML::script('bootstrap-daterangepicker/daterangepicker.js') }}
{{ HTML::script('Intl-Tel-Input/17.0.3/js/intlTelInput-jquery17-0-16.min.js') }}
{{ HTML::script('country-region-selector/crs.min.js') }}
{{--<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/additional-methods.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/localization/messages_es.min.js"></script> --}}
{{ HTML::script('jQueryValidate/jquery.validate.min.js') }}
{{ HTML::script('jQueryValidate/additional-methods.min.js') }}
{{ HTML::script('jQueryValidate/jquery.validationEngine-es.js') }}
{{ HTML::script('jQueryValidate/messages_es.min.js') }}
{{ HTML::script('AccountingJS/accounting.min.js') }}
{{ HTML::script('jquery-browser-plugin/jquery.browser.min.js') }}
{{ HTML::script('bootstrap-select/js/bootstrap-select.min.js') }}
{{ HTML::script('bootstrap-select/js/i18n/defaults-es_CL.min.js') }}
{{ HTML::script('DataTables/dataTables.fixedHeader.min.js') }}
{{ HTML::script('Alphanum/jquery.alphanum.min.js') }}
{{ HTML::script('WebPro/plugins/bootstrap-wizard/bootstrap-wizard.min.js') }}
{{ HTML::script('WebPro/plugins/bootstrap-wizard/bootstrap-wizard.min.js') }}