@extends("WarehouseDashboard.layouts.dashboard.app")

@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1><i class="fa fa-dashboard"></i> {{__('New Orders')}}</h1>
            <p>{{__('View New Orders')}}</p>
        </div>
        <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
            @if(is_warehouse_manger() || is_operator_manger())
                <li class="nav-item" role="Crunchy">
                    <button class="nav-link @if(request()->active == 4)active  @endif"  id="pills-profile-tab" data-toggle="pill" data-target="#pills-cranch" type="button" role="tab" aria-controls="pills-cranch" aria-selected="false">{{__("Crunchy orders")}}</button>
                </li>
            @endif

        </ul>
        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="#">{{__('Orders')}}</a></li>
        </ul>
    </div>
@endsection
@section("content")
    @include("layouts.main-parts.page-message")
    <div class="row">
        <div class="col-md-12">
            <button class="btn btn-primary" style="position: fixed;top:auto;right: auto;bottom:5%;z-index: 1000;" disabled>مجموع الاختيارات :<span id="checkedCount" class="mr-1">0</span></button>
        </div>
        <div class="col-md-12">
            @if(session()->has('error'))
                <div class="alert alert-danger">
                    {{session()->get('error')}}
                </div>
            @endif
            @if(session()->has('success'))
                <div class="alert alert-success">
                    {{session()->get('success')}}
                </div>
            @endif

            @error("new")
            <div class="alert alert-danger">
                {{__("must have at least one order to collect order")}}
            </div>
            @endif
            <div class="tab-content" id="pills-tabContent">
                <div class="tab-pane fade  @if(in_array(!request()->active, [2,3])) active show @endif" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
                    <div class="tile">
                        <div class="tile-body">
                            <form action="{{route("collect.order")}}"  id="new"   data-swal-title="{{__('confirm')}}" data-swal-text="{{__('Are Your Sure To Collect This orders ?')}}" data-yes="{{__('Yes')}}" data-no="{{__('No')}}" data-success-msg="{{__('the orders  has been Collect successfully')}}">
                                <div class="row">
                                    <div class="table-responsive">
                                        <table class="table table-hover table-bordered" id="sampleTable">
                                            <thead>
                                            <tr>
                                                <th><input id="select-all" type="checkbox" class="checkbox" onchange="countChecked(0)" disabled></th>
                                                <th>{{__('Order number')}}</th>
                                                <th>{{__('Branch name')}}</th>
                                                <th>{{__("Type")}}</th>
                                                @if(has_branch())
                                                    <th>{{__("Type")}}</th>
                                                @endif
                                                <th>{{__('Created at')}}</th>
                                                <th>{{__('Order Details')}}</th>
                                                @if(hasWarehousePermissions("edit_order"))
                                                    <th>{{__('Control')}}</th>
                                                @endif
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @foreach($orders as $order)
                  
                                                <tr>
                                                    @php
                                                        $branch_id=$order->FormItems->form->branch->id;
                                                    @endphp
                                                    @php
                                                        if(has_branch() && $order->FormItems->form->branch->seen = 2){
                                                          $s= $order->FormItems->form->branch->seen == 2;
                                                        }else{
                                                            $s= $order->FormItems->form->branch->seen != 2;
                                                        }
                                                    @endphp
                                                    @if($s and $order->FormItems->form->branch->id == $branch_id)
                                                        @if($order->status == 1)
                                                            @php $new =1; @endphp
                                                            <td><input type="checkbox" class="normal checkbox" name="new[]" value="{{$order->id}}" onchange="countChecked(1)" disabled></td>
                                                            <td>{{$order->Order_Number}}</td>
                                                            <td>{{$order->FormItems->form->branch->store_name}}</td>
                                                            <td>{{$order->request_type == 1 ?__("Warehouse"):__("Operator") }}</td>
                                                        @if(has_branch())
                                                                <td>{{$order->request_type == 1 ?__("Warehouse"):__("Operator") }}</td>
                                                            @endif
                                                            <td>{{$order->created_at?? ''}}</td>
                                                            <td>
                                                                <a href="{{route("RequestOrder.details", $order->id)}}" class="btn btn-primary">{{__("Show")}}</i></a>
                                                                <a href="{{route("RequestOrder.details.pdf",$order->id)}}"  class="btn btn-primary c-cursor"  target="_blank"><i class="fas fa-plus"></i> {{__('pdf')}}</a>
                                                            </td>
                                                            @if(hasWarehousePermissions("edit_order"))
                                                                <td>
                                                                    <a href="{{route("RequestOrder.edit", $order->id)}}" class="control-link edit"><i class="fas fa-edit"></i></a>
                                                                </td>
                                                            @endif
                                                        @endif
                                                    @endif
                                                </tr>
                                            @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                @if(hasWarehousePermissions("collect_order"))
                                    <span href="#" class="control-link remove form-confirm" data-form-id="#new"><button type="submit"  class="offset-5 btn btn-primary" >{{__("Collect orders")}}</button></span>
                                @endif

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


        @endsection
        @section("scripts")
            <!-- Data table plugin-->
            <script type="text/javascript" src="{{asset("assets/js/plugins/jquery.dataTables.min.js")}}"></script>
            <script type="text/javascript" src="{{asset("assets/js/plugins/dataTables.bootstrap.min.js")}}"></script>
            <script type="text/javascript">
                function countChecked(num) {
                    const checkboxes = document.querySelectorAll('.checkbox');
                    const allCheckboxes = document.querySelector('#select-all');
                    let checkedCount = 0;

                    checkboxes.forEach(checkbox => {
                        if (checkbox.checked) {
                            checkedCount++;
                        }
                    });
                    console.log(num)
                    let checked= 0;
                    if(num == 0 && allCheckboxes.checked){
                        checked= checkedCount-1;
                    }else {
                        checked = checkedCount;
                    }
                    console.log(checked)
                    document.getElementById('checkedCount').textContent = checked ? checked : checkedCount;
                }
                window.addEventListener('load', function() {
                    const checkboxes = document.querySelectorAll('.checkbox');
                    checkboxes.forEach(checkbox => {
                        checkbox.removeAttribute('disabled');
                    });
                });
            </script>
            <script>
                function changeOrderStatus(event, orderId)
                {

                    let orderStatus = event.value;
                    let orderStatusRoute = "{{route('changeOrderStatus', [':order', ':status'])}}";
                    orderStatusRoute = orderStatusRoute.replace(':order', orderId)
                    orderStatusRoute = orderStatusRoute.replace(':status', orderStatus)
                    window.location.href = orderStatusRoute;
                }

                function filter()
                {
                    let  url = $(this).data("url"),
                        status = $("#Status").val(),
                        startDate = $('#start-date').val(),
                        endDate = $('#end-date').val(),
                        branch = $('#branch').val()
                    let route = '{{route('filter', [':status', ':branch'])}}';

                    if(status){
                        route = route.replace(':status', status)
                    }else{
                        route = route.replace(':status', 'all')
                    }
                    if(branch){
                        route = route.replace(':branch', branch)
                    }else{
                        route = route.replace(':branch', 'all')
                    }
                    if(startDate){
                        route = route + "/" + startDate
                    }

                    if(endDate){
                        if(!startDate){
                            route = route + "/all"
                        }

                        route = route + "/" + endDate
                    }
                    window.location.href = route
                }





                $('#select-all').click(function(event) {
                    if(this.checked) {
                        // Iterate each checkbox
                        $('.normal').each(function() {
                            this.checked = true;
                        });
                    } else {
                        $('.normal').each(function() {
                            this.checked = false;
                        });
                    }
                });



                $('#select-all-cranshe').click(function(event) {
                    if(this.checked) {
                        // Iterate each checkbox
                        $('.cranshe').each(function() {
                            this.checked = true;
                        });
                    } else {
                        $('.cranshe').each(function() {
                            this.checked = false;
                        });
                    }
                });



                function saveTabSelect(e) {
                    localStorage.setItem("tagSelected", e.id);
                    return true;
                }
            </script>
@endsection