@extends('layouts.layout')
@section('title', 'Pagina de Pedidos')
@section('content')
    <div class="row justify-content-center">
        @if ($message = Session::get('success'))
            <div class=" col-6  mt-2 alert alert-success">
                <p>{{ $message }}</p>
            </div>
        @endif

    </div>
    <div class="row justify-content-between m-3">
        <div class="col-lg-3 offset-1">
            <h2 class="font-color-gergal">Pedidos</h2>
        </div>
        <div class="col-lg-4">
            <form class="form-inline" {{-- action="{{ route('pedidos.filter') }}" --}} method="get">
                {{-- @csrf --}}
                <div class="input-group  mx-2">
                    <input type="text" class="form-control" name="nombre" placeholder="Filtrar por cliente, email o estado"
                        value="{{ $filtro }}">
                    <div class="input-group-append">
                        <button class="btn btn-gray " type="submit">Filtrar</button>
                    </div>
                </div>
                <div class="form-check mb-2 mr-sm-2">
                    <input class="form-check-input" {{ $anulado == 1 ? 'checked' : '' }} type="checkbox" id="anulado"
                        name="anulado" value="1">
                    <label class="form-check-label" for="inlineFormCheck">
                        <strong>
                            Anulados
                        </strong>
                    </label>
                </div>
            </form>

        </div>

        @can('order-create')
            <div class="col-lg-3  ">
                <div class="form-group col-8">
                    <label for="dias">Dias hacia atras para el reporte</label>
                    <input class="form-control" id="dias" placeholder="cantidad de dias para el reporte" value="30" />
                </div>
                <div class="form-group col-8">
                    <label for="estado">Filtrar estados para reporte</label>
                    <select class="form-control" name="estado" id="estado">
                        <option value="0" selected>Todos</option>
                        @foreach ($estados as $estado)
                            <option value={{ $estado->id }}>{{ $estado->descripcion }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group col-8">
                    <label for="tipo_usuario">Filtrar por tipo de usuario</label>
                    <select class="form-control" name="tipo_usuario" id="tipo_usuario">
                        <option value="0" selected>Todos</option>
                        @foreach ($tiposUsuario as $tiposUsuario)
                            <option value={{ $tiposUsuario->id }}>{{ $tiposUsuario->descripcion }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="col-8">
                    <a id="download" href="{{ '#' /* route('pedidos.excel')  */ }}" type="button"
                        class="btn btn-excel-gergal">Descargar
                        listado<i class="fas fa-file-excel"></i></a>
                </div>

            </div>
        @endcan
    </div>
    <div class="row justify-content-center">
        <div class="col-12 col-xl-10 table-responsive">
            @if ($pedidos->isEmpty())
                <p class="lead">No hay pedidos registrados.</p>
            @else
                <span>
                    <i class="fas fa-asterisk"></i>
                    Los totales incluyen el descuento
                </span>
                <table class="table table-bordered">
                    <thead>
                        @if (!method_exists($pedidos, 'render'))
                            <th>Pedido</th>
                            <th>Usuario</th>
                            <th>Creado</th>
                            <th>Actualizado</th>
                            <th>Total</th>
                            <th>Descuento</th>
                            <th>Estado</th>
							<th>Mercado pago</th>
                        @else
                            <th scope="col">@sortablelink('id', 'Pedido' )</th>
                            <th scope="col">@sortablelink('cli_id', 'Usuario')</th>
                            <th scope="col">@sortablelink('fecha_creado','Creado') </th>
                            <th scope="col">@sortablelink('fecha_modif','Actualizado') </th>
                            <th scope="col">@sortablelink('precio_total', 'Total') </th>
                            <th scope="col">@sortablelink('descuento', 'Descuento') </th>
                            <th scope="col">@sortablelink('estado', 'Estado') </th>
							<th scope="col">@sortablelink('id_mercado_pago', 'ID Mercado Pago') </th>
                        @endif
                        <th scope="col"></th>
                    </thead>
                    <tbody>
                        @foreach ($pedidos as $pedido)
                            <tr>
                                <form id="{{ $pedido->id }}" dblclick="handlerClick" action="">
                                    <td><a href="{{ route('pedidos.show', $pedido->id) }}">{{ $pedido->id }}</a></td>
                                    <td>{{ $pedido->usuario->nombre . ' ' . $pedido->usuario->apellido }}</td>
                                    <td>{{ \Carbon\Carbon::parse($pedido->fecha_creado)->format('d/m/Y H:i') }}</td>
                                    <td>	{{ \Carbon\Carbon::parse($pedido->fecha_modif)->format('d/m/Y H:i') }}</td>

                                    <td>
                                        <p class="form-dblclick" name="{{ 'precio_total_' . $pedido->id }}"
                                            class="currency">
                                            $ {{ number_format((str_replace('$', '', $pedido->precio_total) - ($pedido->descuento ?? 0)),2,',','.') }}</p>

                                    </td>
                                    <td>{{ $pedido->descuento > 0 ? "- $ ". number_format($pedido->descuento,2,',','.') : '$0' }}</td>
                                    <td>{{ $pedido->estadoR->descripcion }}</td>
									<td>
										<a href="#" onclick="renderDataPedido({{$pedido->id_mercado_pago}})" data-toggle="modal" data-target="#miModal">
											{{ $pedido->id_mercado_pago }}
										</a>
{{--										<a > </a>--}}
									</td>
                                </form>
                                <td>
                                    @can('product-edit')
                                        <a href="{{ route('pedidos.edit', $pedido->id) }}" type="button"
                                            class="btn btn-outline-primary btn-sm  my-1"> <i class="fas fa-edit"></i></a>
                                    @endcan
                                    @can('product-delete')
                                        @if ($pedido->anulado == 0)
                                            <form name="form-delete" action="{{ route('pedidos.update', $pedido->id) }}"
                                                method="POST">
                                                @csrf
                                                <input type="hidden" name="anulado" value="1">
                                                @method('PUT')
                                                <button type="submit" class="btn btn-outline-danger btn-sm" disabled>Anular<i
                                                        class="fas fa-trash-alt"></i></button>
                                            </form>
                                        @endif
                                    @endcan

                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            @endif
            {{ method_exists($pedidos, 'appends') ? $pedidos->appends(\Request::except('page'))->render() : '' }}


        </div>
		<div class="modal fade" id="miModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title" id="exampleModalLabel">Informacion de pago</h5>
						<button type="button" class="close" data-dismiss="modal" aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<div class="modal-body">
						<!-- Contenido del Modal -->
						<h5> Pedido ID: </h5> <p id="pedido"> </p>
						<h5> Estado: </h5> <p id="status"> </p>
						<h5> Detalle Estado: </h5> <p  id="order_status"> </p>
						<h5> Total: </h5> <p  id="total_amount"> </p>
						<h5> Fecha creado: </h5> <p  id="date_created"> </p>
						<h5> Ultima actualizacion: </h5> <p  id="last_updated"> </p>
						<h3>Detalle ultimo movimiento</h3>
						<h5> Id </h5> <p  id="payment_id"> </p>
						<h5> Monto de transaccion </h5> <p  id="payment_transaction_amount"> </p>
						<h5> Estado</h5> <p  id="payment_status"> </p>
						<h5> Detalle Estado </h5> <p  id="payment_status_detail"> </p>
						<h5> Fecha Creado </h5> <p  id="payment_date_created"> </p>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
					</div>
				</div>
			</div>
		</div>

    </div>

    <script type="text/javascript">
		const urlPedido = '{{ route('api.pago.index', '_ID_') }}';
        window.addEventListener('click', function() {
            const downloadExcel = document.querySelector('#download');
            const anuladoCheckbox = document.querySelector('#anulado');

            downloadExcel.addEventListener('click', function(evt) {
                const days = document.querySelector('#dias').value;
                const state = document.querySelector('#estado').value;
                const userType = document.querySelector('#tipo_usuario').value;
                let url = `