@extends('layouts.delegates_dashboard_layout')

@section('title')
{{Session::has('lang')&&Session::get('lang')=='en'?' Home':'الرئيسية'}}

@endsection

@section('style')

@endsection

@section('content')

    <div class="dash-title p-2">
        <h6 class="bold">{{trans('delegates_dashboard.delegates_dashboard')}}</h6>
        <p class="mb-1">{{trans('delegates_dashboard.welcome')}} {{Auth::user()->name}}</p>
    </div>

    <div class="row ">
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$inprogress}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.recent_orders')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{ $finished}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.finished_orders')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/checked-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$closed}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.closed_orders')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/times-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>

        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$pending_requests}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.pending_requests')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$approved_requests}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.approved_requests')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/checked-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$rejected_requests}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.rejected_requests')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/times-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$active_delegates}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.active_delegates')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$pending_delegates}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.pending_delegates')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/checked-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
        <div class="col-sm-6 col-md-4  p-2">
            <div class=" dash-header-card color-white p-3 round5 gradient-bg">
                <h3 class="bold">{{$blocked_delegates}}</h3>
                <h6 class="font12">{{trans('delegates_dashboard.block_delegates')}}</h6>
                <div class="icon">
                    <img class="icon-img" src="{{URL::to('site/imgs/icons/times-list.svg')}}" alt="">
                    <img class="rect" src="{{URL::to('site/imgs/icons/Rectangle 1906.svg')}}" alt="">
                </div>
            </div>
        </div>
    </div>

    <!-- end dashboard -->

    <!-- start new order table -->
    

    <div  class="table-cont p-2 ">
        <div class="row align-items-center">
            <div class="dash-title col-md p-0 mt-3">
                <h6 class="bold">{{trans('delegates_dashboard.recently_delegates')}}</h6>
                <p class="mb-1">{{trans('delegates_dashboard.recently_delegates_info')}}</p>
            </div>



            
        </div>
        
        <table id="dataTable1" data-order='[[ 1, "asc" ]]' data-page-length='25' class="table text-center  table-striped table-ed" style="width:100%">
            <thead class="table-head">
                <tr >
                    <th class="font10">{{trans('delegates_dashboard.number')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.avatar')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.name')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.phone')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.nationality')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.city')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.status')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.recent_order')}}</th>
                    <th class="font10">{{trans('delegates_dashboard.created_at')}}</th>
                    <th></th>
                </tr>
            </thead>
            <tbody data-class-name="table-body">
                @foreach($recent_added as $delegate)
                <tr>
                    <td>{{$delegate->user?->id}}</td>
                    <td>
                        <img src="{{$delegate->user?->avatarPath}}" style="max-width: 60px;" alt="">
                    </td>
                    <td>{{$delegate->user?->name}}</td>
                    <td>0{{$delegate->phone}}</td>
                    <td>{{$delegate->nationality?->name }}</td>
                    <td>{{$delegate->city?->name }}</td>
                    <td>{{trans('delegates_dashboard.'.$delegate->user?->status)}}</td>
                    <td>{{$delegate->user?->delegateOrders->where('status','inprogress')->first()?trans('delegates_dashboard.yes'):trans('delegates_dashboard.no')}}</td>
                    <td>{{Carbon\Carbon::parse($delegate->user?->created_at)->format('d/m/Y - H:i A')}}</td>
                    <td class="table-menu">
                        <i onclick="openTableMenu(this)" class=" cp p-2 fa fa-ellipsis-h"></i>
                        <div class="menu-cont">
                            <ul class="white-bg round7 pt-1 pb-1 shadow1">
                                <!-- <li> <a href="{{route('delegates_dashboard.delegate_details',$delegate->user->id)}}"><i class="far fa-eye color1"></i>{{trans('delegates_dashboard.details')}}</a> </li> -->
                                <!-- <li> <a href="{{route('delegates_dashboard.get_delegate_details',$delegate->user->id)}}"><i class="fa fa-edit color1"></i> {{trans('delegates_dashboard.edit')}}</a> </li> -->
                                <li class="border-bottom"></li>
                                <form id="blockform">
                                @csrf
                                <input type="hidden" name="user_id" value="{{$delegate->user_id}}">
                                </form>   
                                <input type="hidden" id="deleted_user" value="{{$delegate->id}}">
                                    <form id="deleteform">
                                        @csrf
                                        <input type="hidden" id="user" name="user_id" value="">
                                    </form>        
                                <li> <a href="#" name="{{$delegate->user_id}}" onclick="deleteElement()"><i class="far fa-trash-alt color-red"></i> {{trans('delegates_dashboard.delete')}}</a> </li>
                            </ul>
                        </div>
                    </td>
                </tr>
                @endforeach
            </tbody>

        </table>
    </div>
    <!-- end new order table -->        
@endsection

@section('scripts')
       <script>
               function deleteElement(){
                var button = event.target;
                var user = button.name;
                $('#user').val(user);
                    Swal.fire({
                        title: '<h5 class="bold">{{trans('delegates_dashboard.delete_it')}}</h5>',
                        icon: 'warning',
                        html:'<p>{{trans('delegates_dashboard.delete_desc')}}</p> ' 
                             +'<div class="row">'
                             +'    <div class="col"><button class="button1 deletebtn w-100" >{{trans('delegates_dashboard.delete')}}</button></div>'
                             +'    <div class="col"><button class="button3 w-100" onclick="Swal.clickCancel()" >{{trans('delegates_dashboard.return')}}</button></div>'
                             +'</div>',
                        showCancelButton: false,
                        showConfirmButton: false,
                        })
                    
                }
       </script>


<script>
        $(document).on('click',".deletebtn",function(e){
            e.preventDefault();
            var form = $('#deleteform').get(0);
            var formData = new FormData(form);
            var oldText = $(this).text();
            $(this).prop('disabled', true).css({
                opacity:'0.5'
            }).text("{{trans('delegates_dashboard.loading')}}");
            $.ajax({
                url:"{{route('delegates_dashboard.delete_delegate')}}",
                type:"POST",
                data: formData,
                dataType: "json",
                processData: false,
                contentType: false,
                cache: false,
                success:function(data){
                    $('#deletebtn').removeAttr("disabled").css({
                        opacity:'1'
                    }).text(oldText);
                    if(data.key =='success'){
                        Swal.fire({icon: 'success',
                                title: '<h5 class="bold">'+ data.msg +'</h5>',
                                showConfirmButton: false,
                                timer: 1500
                            });
                            location.reload();
                    }else{
                        Swal.fire({
                            title: data.msg,
                            position:'top',
                            timer: 3000,
                            type:'error',
                            showCloseButton: false,
                            showConfirmButton:false,
                            animation: true
                        })
                    }
                }
            });
        });
    </script>
    
@endsection