@include('site.foreign.controllers.upper-header')
@include('site.foreign.controllers.header')

<nav aria-label="breadcrumb" class="breadcrumb">
    <div class="container">
        <div class="c-item-search">
            <ol class="breadcrumb mb-0 inline">
                <li class="breadcrumb-item"><a href="{{route('foreign_home')}}">@lang('data.home')</a></li>
                <li class="breadcrumb-item active" aria-current="page">@lang('data.complaints')</li>
            </ol>
            <div class="s-content">
                <button class="basic-butt btn " href="#add-complaints" data-toggle="modal"
                        data-target="#add-complaints">@lang('data.addComplaint')
                </button>

                <div class="search-bar">

                    <input name="compliant_code" id="compliant_code" type="text" placeholder="@lang('data.searchComplaint')">
                    <button id="search_complaint"><img src="{{asset('site/foreign/images/s-search.svg')}}" alt=""></button>
                </div>
            </div>
        </div>
    </div>
</nav>
<div class="container mb-60 mt-30" id="complaintSearchResult">
    @forelse($rows as $row)
        <div class="bordered mt-30">
            <div class="row">
                <div class="col-sm-4">
                    <article class="blue-complain">
                        <h5><strong>@lang('data.complaintCode')</strong></h5>
                        <p><small>{{$row->code}}</small></p>
                    </article>
                </div>
                <div class="col-sm-4">
                    <article class="green-complain">
                        <h5><strong>@lang('data.client_name')</strong></h5>
                        <p><small>{{$row->client->name}}</small></p>
                    </article>
                </div>


                <div class="col-sm-4">
                    <article class="green-complain">
                        <h5><strong>@lang('data.order_no')</strong></h5>
                        <p><small>{{$row->order->code}}</small></p>
                    </article>
                </div>
                <div class="col-sm-4">
                    <article class="green-complain">
                        <h5><strong>@lang('data.complaint_status')</strong></h5>
                        <p><small>{{getComplaintStatus($row->status)}}</small>
                        </p>
                    </article>
                </div>
                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                    <button class="btn mt-20 mb-20 radius-20 active-c" href="#detailes1" data-toggle="modal"
                            data-target="#detailes1{{$row->id}}">@lang('data.complaintReply')
                    </button>
                    <button class="btn btn-primary mt-20 mb-20 radius-20" href="#detailes" data-toggle="modal"
                            data-target="#detailes{{$row->id}}">@lang('data.details')
                    </button>
                </div>
            </div>
        </div>

        <div class="modal fade" id="detailes{{$row->id}}" role="dialog" aria-labelledby="detailes" aria-hidden="true"
             tabindex="-1">
            <div class="modal-dialog modal-dialog-centered signmodel" role="document">
                <div class="modal-content">
                    <!-- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button> -->

                    <div class="modal-body">
                        <!-- detailes -->
                        <h4 class="d-flex space-btw"><strong>@lang('data.clientInfo')</strong></h4>
                        <div class="bordered">
                            <div class="row">
                                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                                    <article class="blue-complain">
                                        <h5><strong>@lang('data.worker_name') </strong></h5>
                                        <p>
                                            <small>{{$row->order->cv_id ? $row->order->cv->name : $row->order->order_worker->name}}</small>
                                        </p>
                                    </article>
                                </div>
                                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                                    <article class="green-complain">
                                        <h5><strong>@lang('data.mobile')</strong></h5>
                                        <p>
                                            <small>{{$row->order->cv_id ? $row->order->cv->mobile : $row->order->order_worker->mobile}}</small>
                                        </p>
                                    </article>
                                </div>

                                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                                    <article class="blue-complain">
                                        <h5><strong>@lang('data.email')</strong></h5>
                                        <p>
                                            <small>{{$row->order->cv_id ? $row->order->cv->email : $row->order->order_worker->email}}</small>
                                        </p>
                                    </article>
                                </div>

                            </div>
                        </div>
                        <!-- detailes -->
                        <h4 class="mt-20"><strong>@lang('data.orderInfo')</strong></h4>
                        <div class="bordered">
                            <div class="row">
                                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                                    <article class="blue-complain">
                                        <h5><strong>@lang('data.order_no')</strong></h5>
                                        <p><small>{{$row->order->code}}</small></p>
                                    </article>
                                </div>
                                <div class="col-md-4 col-sm-6 col-xs-6 mb-20">
                                    <article class="blue-complain">
                                        <h5><strong>@lang('data.complaint_status') </strong></h5>
                                        <p>
                                            <small>{{$row->status == 'new' ? Lang::get('data.new') : Lang::get('data.closed')}}</small>
                                        </p>
                                    </article>
                                </div>
                                <form method="post" action="{{route('foreign_update_complaint',$row->id)}}">
                                    @csrf
                                    <div class="col-md-4 col-sm-12 col-xs-12 mb-20">
                                        <select name="status" required class="form-control mt-10" id="">
                                            <option disabled selected>@lang('data.changeComplaintStatus')</option>
                                            <option {{$row->status == 'new' ? 'selected': ""}} value="new">@lang('data.open')
                                            </option>
                                            <option {{$row->status == 'contacted' ? 'selected': ""}} value="contacted">
                                                @lang('data.contacted')
                                            </option>
                                            <option {{$row->status == 'closed' ? 'selected': ""}} value="closed">@lang('data.closed')
                                            </option>
                                        </select>
                                    </div>
                                    <div class="clearfix"></div>
                                    <div class="col-sm-12">
                                        <article>
                                            <h5 class="blue-complain"><strong>@lang('data.complaintNotes')</strong></h5>
                                            <p class="bordered"><small>
                                                    {{$row->notes}}
                                                </small></p>
                                        </article>
                                    </div>
                                    <button type="submit" class="form-butt">@lang('data.update')</button>

                                </form>

                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="detailes1{{$row->id}}" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">@lang('data.complaintReply')</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <ul>
                            <li class="inline modal-h-li">@lang('data.complaintNumber') : <span>{{$row->code}}</span></li>
                            <li class="inline modal-h-li">@lang('data.ClientNumber') : <span>{{$row->client->name}}</span></li>
                        </ul>
                    </div>
                    <div class="modal-body">
                        <h5>نص الشكوى</h5>
                        <form action="{{route('foreign_reply_complaint',$row->id)}}" method="post" class="text-center">
                            @csrf
                            <textarea name="reply" required cols="30" rows="3" placeholder="@lang('data.writeReply') "></textarea>
                            <button type="submit" class="form-butt">@lang('data.send')</button>
                        </form>
                    </div>

                </div>
            </div>
        </div>

    @empty
        <h3>{{Lang::get('data.noComplaints')}}</h3>
    @endforelse
    <div class="text-center" style="margin-top: 30px">
        {{$rows->links()}}
    </div>


    <!-- modal -->

    <div class="modal fade" id="add-complaints" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <form method="post" action="{{route('foreign_new_complaint')}}" class="text-center">
                    @csrf
                    <div class="modal-header">
                        <h4 class="modal-title"> @lang('data.addComplaint')</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>

                        <ul class="flex-label">
                            <li class="inline modal-h-li item-flex">
                                <span>
                                @lang('data.order_no') :
                                </span>
                                <select name="order_id" id="order" required class="form-control">
                                    <option disabled selected>@lang('data.selectOrderNo')</option>
                                    @foreach($orders as $order)
                                        <option value="{{$order->id}}">{{$order->code}}</option>
                                    @endforeach
                                </select></li>
                            <li id="worker_name" class="inline modal-h-li"></li>
                        </ul>
                    </div>
                    <div class="modal-body">
                        <h5>@lang('data.complaintNotes')</h5>

                        <textarea name="notes" required cols="30" rows="2"
                                  placeholder="@lang('data.complaintNotes')"></textarea>
                        <button type="submit" class="form-butt">@lang('data.send')</button>
                    </div>
                </form>

            </div>
        </div>
    </div>


</div>



@include('site.foreign.controllers.footer')