@php
$estados = ['Creado', 'Tomado', 'Preparando', 'Listo a entregar', 'Entregando', 'Finalizado', 'Anulado', 'Rechazado', 'Error tarjeta'];
$estilos = ['purple', 'primary', 'orange', 'danger', 'info', 'success', 'yellow', 'red', 'secondary', 'gray'];

@endphp

@forelse ($DataResult as $item)

    <tr id="pedido-{{ $item->PEDI_ID }}">

        <td>
            {{ $item->PEDI_ID }}
            @if ($item->PEDI_FECHA == date('Y-m-d') && $item->PEDI_HORA > date('H:i:s'))
                <span
                    style="padding-left: 9px; position: absolute; font-size: 9px; margin-top: 0px; color: #{{ env('APP_COLOR') }}; width: 74px; white-space: nowrap; overflow: hidden;
                        text-overflow: ellipsis; font-weight: 500;">PROGRAMADO</span>
            @endif
            <br>
            <span class="text-secondary"
                style="font-size: 11px">{{ (DateTime::createFromFormat('Y-m-d', $item->PEDI_FECHA)->format('d-m-Y') == date('d-m-Y') ? 'Hoy ' : DateTime::createFromFormat('Y-m-d', $item->PEDI_FECHA)->format('d-m-Y')) . ' a las ' . DateTime::createFromFormat('H:i:s', $item->PEDI_HORA)->format('h:i A') }}</span><br>
            @if ($item->FORP_ID != '00001' && $item->PEDI_ESTADO == 8)
                <span class="text-danger">{{ $item->PEDI_CODREF }}</span>
            @endif
        </td>

        <td>
            <div class="d-flex align-items-center">
                @if (in_array(46, Session::get('Permisos')))
                    {{-- <button type="button" data-bs-toggle="tooltip" data-bs-placement="top" title="Enviar Push a comercio." class="btn btn-danger"
                        onclick="confirmar2('¿Está seguro de enviar la notificación?', 'Aceptar', ()=>MakeRequestData('{{ route('notificacion-rest', [$item->RESS_ID]) }}', '', 'GET', 2, '','',false, true))"><span class="fa fa-bell"></span></button> --}}
                @endif

                {{-- MENSAJES comercio --}}
                <div class="dropdown">
                    <a href="#" data-bs-toggle="tooltip" data-bs-placement="top" title="Enviar push al comercio"
                        data-toggle="dropdown"><i class="fas fa-bell"
                            style="font-size: 20px; color: red; margin-right: 5px;"></i></a>
                    <ul class="dropdown-menu">
                        @foreach ($mensajesComercio as $mensaje)
                            <li> <a class="dropdown-item bg-secondary text-white pt-3 pb-3" style="cursor: pointer"
                                    title="{{ $mensaje->mens_mensaje }}"
                                    onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                    onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                    onclick="confirmar2('¿Está seguro de enviar este mensaje al comercio?', 'Aceptar', ()=>MakeRequestData('{{ route('pedidos.sendPush', ['ressId' => $item->RESS_ID, 'mensId' => $mensaje->mens_id, 'sendTo' => 'comercio']) }}', '', 'GET', 3, '', '', true, true))">{{ $mensaje->mens_asunto }}</a>
                            </li>
                        @endforeach
                    </ul>
                </div>

                <div class="ms-2" @if ($item->PEDI_ESTADO == 8) style="height: 60px;" @endif>
                    <span class="text-primary"><strong class="3campoOrden">{{ $item->comercio }}</strong></span> <br>
                    <span class="text-{{ $item->FORP_ID == '00001' ? 'success' : 'primary' }}"><strong
                            class="4campoOrden">{{ $item->formaPago }}</strong></span>
                </div>
            </div>
        </td>

        <td style="width: 295px">
            @if (in_array(45, Session::get('Permisos')))
                {{-- <button data-bs-toggle="tooltip" data-bs-placement="top" title="Enviar notificación."
                        class="btn btn-yellow" style="background-color: #{{ env('APP_COLOR') }}"
                        onclick="MakeRequestData('{{ route('notificacion-cliente', [$item->CLIE_ID]) }}', '#CuerpoMModal', 'GET', 2, '', '#MModalInfo')"><i
                            class="fas fa-user"></i>
                </button> --}}

                {{-- MENSAJES CLIENTE --}}
                <div style="display: inline-block; position:relative; top: 4px">
                    <a data-toggle="dropdown" data-bs-toggle="tooltip" data-bs-placement="top"
                        title="Enviar push al cliente" href="#">
                        <i class="fas fa-user" style="color: #{{ env('APP_COLOR') }}; font-size:20px"></i>
                    </a>
                    <ul class="dropdown-menu">
                        @foreach ($mensajesCliente as $mensaje)
                            <li> <a class="dropdown-item bg-secondary text-white pt-3 pb-3" style="cursor: pointer"
                                    title="{{ $mensaje->mens_mensaje }}"
                                    onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                    onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                    onclick="confirmar2('¿Está seguro de enviar este mensaje al cliente?', 'Aceptar', ()=>MakeRequestData('{{ route('pedidos.sendPush', ['clieId' => $item->CLIE_ID, 'mensId' => $mensaje->mens_id, 'sendTo' => 'cliente']) }}', '', 'GET', 3, '', '', true, true))">{{ $mensaje->mens_asunto }}</a>
                            </li>
                        @endforeach
                    </ul>
                </div>
            @endif

            <a data-bs-toggle="tooltip" data-bs-placement="top" title="{{ $item->CLIE_COORDENADA }}" class="ms-3"
                href="{{ route('cliente-full-info', ['CLIE_ID' => $item->CLIE_ID]) }}" target="_blank">
                <span class="1campoOrden"> {{ $item->cliente }}</span>
            </a>
            @if ($item->CLIE_TEL)
                <a target="_blank" href="https://wa.me/{{ $item->CLIE_TEL }}?text=Hola,%20{{ $item->cliente }}"> <img
                        style="height: 20px; margin-bottom: 3px;"
                        src="https://img.icons8.com/color/48/000000/whatsapp--v1.png" /> {{ $item->CLIE_TEL }}</a>
            @endif
            <br>
            <span data-bs-toggle="tooltip" data-bs-placement="left" title="{{ $item->PEDI_DIRECCION }}"
                style="padding-left: 35px; font-size: 12px; margin-top: -1px; color: gray; width: 290px; display:inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                {{ $item->PEDI_DIRECCION }}
            </span>
            {{-- <a
                    data-bs-toggle="tooltip" data-bs-placement="top" title="{{$item->CLIE_COORDENADA}}"
                    class="ms-3" href="#" onclick="MakeRequestData('{{route('cliente-graficas', [$item->CLIE_ID])}}', '#BigModalBody', 'GET', 2, '', '#BigModalInfo')">
                        <span class="1campoOrden"> {{$item->CLIE_NOMBRE}}</span> <span class="2campoOrden">{{$item->CLIE_APELLIDO}}</span>
                    </a> --}}
        </td>


        <td>
            {{-- <div class="dropdown">

                    <button data-bs-toggle="tooltip" data-bs-placement="top" title="Enviar Notificación al Driver"
                        class="badge btn-{{ isset($item->Repartidor) ? 'primary' : 'white' }}" data-toggle="dropdown"
                        style="height: 28px;">
                        <i class="fas fa-motorcycle" style="font-size: 19px;"></i> &nbsp; &nbsp; <span
                            class="5campoOrden">
                            {!! isset($item->Repartidor) ? $item->Repartidor : '<span style="color: #000">NO ASSIGNED</span>' !!}</span>
                    </button>

                    @if (in_array(47, Session::get('Permisos')))
                        <div class="dropdown-menu">
                            @php
                                $TituloBotones = ['Asignación', 'Recordatorio', 'Listo', 'Quitado', 'Cancelado', 'Pedido sin tomar', 'Alarma 2'];
                            @endphp

                            @for ($i = 0; $i < 6; $i++)
                                <a class="dropdown-item bg-{{ $estilos[$i] }} text-white pt-3 pb-3"
                                    style="cursor: pointer"
                                    onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                    onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                    onclick="confirmar2('¿Está seguro de enviar la notificación?', 'Aceptar', ()=>MakeRequestData('{{ route('notificacion-delivery') }}', '', 'POST', 2, '','',false, true, false, ['Identificador/{{ $item->EMPL_ID }}', 'Rest/{{ $item->RESS_NOMBRE }}', 'TNotificacion/{{ $i }}']))">{{ $TituloBotones[$i] }}</a>
                            @endfor
                        </div>
                    @endif
                </div> --}}

            {{-- MENSAJES repartidor --}}
            <div class="dropdown" style="display: inline-block; position:relative; bottom:15px;">
                <a data-bs-toggle="tooltip" data-bs-placement="top" title="Enviar push al repartidor" href="#"
                    data-toggle="dropdown"><i style="font-size: 20px;" class="fas fa-motorcycle"></i>
                </a>
                <ul class="dropdown-menu">
                    @foreach ($mensajesDriver as $mensaje)
                        <li> <a class="dropdown-item bg-secondary text-white pt-3 pb-3" style="cursor: pointer"
                                title="{{ $mensaje->mens_mensaje }}"
                                onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                onclick="confirmar2('¿Está seguro de enviar este mensaje al repartidor?', 'Aceptar', ()=>MakeRequestData('{{ route('pedidos.sendPush', ['emplId' => $item->EMPL_ID, 'mensId' => $mensaje->mens_id, 'sendTo' => 'repartidor']) }}', '', 'GET', 3, '', '', true, true))">{{ $mensaje->mens_asunto }}</a>
                        </li>
                    @endforeach
                </ul>
            </div>

            {{-- CAMBIAR REPARTIDOR --}}
            <div class="dropdown" style="display: inline-block">
                {{-- <button class="btn btn-yellow d-inline" style="background-color: #{{ env('APP_COLOR') }}"
                        data-toggle="dropdown">
                        {{ $item->Repartidor ?? 'NO ASIGNADO' }}
                    </button> --}}
                <a class="#" data-toggle="dropdown">{{ $item->repartidor ?? 'NO ASIGNADO' }}</a>
                <ul class="dropdown-menu">
                    @foreach ((json_decode($sucursales[array_search($item->SUCU_ID, array_column($sucursales, 'SUCU_ID'))]->repartidores))??[] as $repartidor)
                        <li> <a class="dropdown-item bg-secondary text-white pt-3 pb-3" style="cursor: pointer"
                                onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                onclick="confirmar2('¿Está seguro asignar el pedido a este repartidor?', 'Aceptar', ()=>MakeRequestData('{{ route('edit-info-pedido', ['IdPedido' => $item->PEDI_ID, 'campo' => 0, 'vista' => 1]) }}'+'&NuevoDato={{ $repartidor->CLIE_ID }}', '#pedido-{{ $item->PEDI_ID }}','GET',3))">{{ $repartidor->CLIE_NOMBRE . ' ' . $repartidor->CLIE_APELLIDO }}</a>
                        </li>
                    @endforeach
                </ul>
                <br>
                <span style="font-size: 12px; color: gray;">{{ $item->SUCU_NOMBRE }}</span>
            </div>
        </td>

        <td onclick="MakeRequestData('{{ route('tiempos-pedido', [$item->PEDI_ID]) }}', '#CuerpoSModal', 'GET', 2,'','#SModalInfo')"
            class="text-center">
            <strong> {{ tiempoPedido($item)->tiempo }} </strong>
        </td>

        <td class="text-center">
            <div style="display: flex; justify-content: space-around;">
                <div class="dropdown">
                    <button data-bs-toggle="tooltip" data-bs-placement="top" title="Cambiar estado al pedido"
                        class="badge btn-{{ $estilos[$item->PEDI_ESTADO] }} p-2" style="height: 28px;"
                        data-toggle="dropdown">
                        <i class=" fas fa-edit" style="font-size: 19px;"></i> &nbsp;&nbsp; <span class="0campoOrden">
                            {{ $estados[$item->PEDI_ESTADO] }}</span>
                    </button>
                    @if (in_array(44, Session::get('Permisos')))
                        <ul class="dropdown-menu">
                            @for ($i = 0; $i < 9; $i++)
                                <li> <a class="dropdown-item bg-{{ $estilos[$i] }} text-white pt-3 pb-3"
                                        style="cursor: pointer"
                                        onmouseover="$(this).addClass('bg-white'); $(this).removeClass('text-white')"
                                        onmouseout="$(this).removeClass('bg-white'); $(this).addClass('text-white')"
                                        onclick="confirmar2('¿Está seguro de cambiar el estado al pedido?', 'Aceptar', ()=>MakeRequestData('{{ route('cambiar-estado', ['Pedido'=>$item->PEDI_ID, 'Estado'=>$i]) }}', '#pedido-{{ $item->PEDI_ID }}', 'GET',3))">
                                        {{ $estados[$i] }} </a></li>
                            @endfor
                        </ul>
                    @endif
                </div>
                @if (in_array(43, Session::get('Permisos')))
                    {{-- <button class="btn btn-primary" data-bs-toggle="tooltip" data-bs-placement="top"
                            title="Información del pedido."
                            onclick="MakeRequestData('{{ route('pedido-detalle', [$item->PEDI_ID]) }}', '#BigModalBody', 'GET', 2,'','#BigModalInfo')">
                            <i class="fas fa-eye"></i>
                        </button> --}}

                    <button style="margin-left: 8px" data-bs-toggle="tooltip" data-bs-placement="top"
                        title="Detalles del pedido" class="btn btn-primary"
                        onclick="MakeRequestData('{{ route('pedido-detalle', [$item->PEDI_ID]) }}', '#BigModalBody', 'POST', 2, '', '#BigModalInfo', true, false, false,['Id/0', 'Contenedor/0', 'Tipo/3'])">
                        <i class="fas fa-info"></i>
                    </button>
                @endif
            </div>

            @if ($item->PEDI_ESTADO == 0 && ($item->EMPL_ID == 0 || $item->EMPL_ID == null || $item->EMPL_ID == ''))
                <audio controls autoplay style="display: none">
                    <source src="{{ asset('sounds/goSoundP2.mp3') }}" type="audio/mpeg">
                    Your browser does not support the audio element.
                </audio>
            @endif
        </td>
    </tr>
    @if ($item->PEDI_ESTADO == 0 && ($item->EMPL_ID == 0 || $item->EMPL_ID == null || $item->EMPL_ID == ''))
        <script>
            Notification.requestPermission().then(function(permission) {
            });

            var title = "Nuevo pedido de {{ $item->comercio }}";
            var body = "Hay un nuevo pedido del cliente: {{ $item->cliente }}";
            var notification = new Notification(title, {
                body
            });
        </script>
    @endif
@empty
    <tr>
        <td colspan="7" class="text-center"> No se encontraron pedidos</td>
    </tr>
@endforelse

@if (!is_array($DataResult))
    <x-pagination>
        @slot('data', $DataResult)
        @slot('parametros', ['pediEstado' => $pediEstado ?? ''])
    </x-pagination>
@endif
@if (isset($Estado) && $Estado == true)
    <tr>
        <td><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
@endif