@extends("layouts.admin.app")
@section("page-title")
    {{__("Dashboard")}}
@endSection
@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1><i class="fa fa-dashboard"></i>{{__("Items")}}</h1>
            <p>{{__("Items")}}</p>
        </div>

        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="#">{{__("Dashboard")}}</a></li>
            <li class="breadcrumb-item"><a href="{{route("admin.items.index")}}">{{__("Items")}}</a></li>
            <li class="breadcrumb-item"><a href="#">{{__("Edit")}}</a></li>
        </ul>
    </div>
@endsection

@section("content")

    <div class="row">
        <div class="col-lg-10 m-auto">
            <div class="tile">
                <h3 class="tile-title">{{__("Edit Item")}}</h3>
                <div class="tile-body">
                    <form method="post" action="{{route("admin.items.update", ["id" => $item->id])}}" enctype="multipart/form-data">
                        @csrf
                        @method("put")
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("English Name")}}</label>
                                    <input class="form-control @if($errors->has('name_en')) is-invalid @endif" type="text" name="name_en" placeholder="{{__("Enter English Name")}}" value="{{ inputValue("name_en", $item) }}">
                                </div>
                                @error("name_en")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Arabic Name")}}</label>
                                    <input class="form-control @if($errors->has('name_ar')) is-invalid @endif" type="text" name="name_ar" placeholder="{{'Enter Arabic Name'}}"  value="{{inputValue("name_ar",$item)}}">
                                </div>
                                @error("name_ar")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Price")}}</label>
                                    <input type="number" step="any" class="form-control @if($errors->has('price')) is-invalid @endif" name="price" placeholder="{{'Enter Price'}}"  value="{{$item->price}}">
                                </div>
                                @error("price")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("max-number-to-order")}}</label>
                                    <input type="number" step="any" class="form-control @if($errors->has('max_number_to_order')) is-invalid @endif"  name="max_number_to_order" placeholder="{{__("enter-max-number-to-order")}}" value="{{$item->max_number_to_order}}">
                                </div>
                                @error("max_number_to_order")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>   
{{--                            <div class="col-lg-6">--}}
{{--                                <div class="form-group">--}}
{{--                                    <label class="control-label">{{__("tax")}}</label>--}}
{{--                                    <input class="form-control @if($errors->has('tax')) is-invalid @endif" type="number" name="tax" placeholder="{{'Enter tax'}}" value="{{inputValue("tax",$item)}}">--}}
{{--                                </div>--}}
{{--                                @error("tax")--}}
{{--                                <div class="input-error">{{$message}}</div>--}}
{{--                                @enderror--}}
{{--                            </div>--}}
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="get-addons">{{__('Select Category')}}</label>
                                    <select class="form-control @if($errors->has('category_id')) is-invalid @endif" name="category_id" data-url="{{ route("ajax.add_ons.by_category") }}" id="get-addons">
                                        <option value="">{{__('None')}}</option>
                                        @foreach($categories as $category)
                                            <option {{ selected("category_id", $category->id, $item) }} value="{{$category->id}}">{{$category->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                @error("category_id")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__('Tax')}}</label>
                                    <div class="input-group">
                                        <input class="form-control" type="number" name="tax" placeholder="{{__('enter-tax')}}" value="{{$item->tax}}">
                                        <div class="input-group-append"><span class="input-group-text">%</span></div>
                                    </div>
                                    <div class="invalid-feedback" style="display: none"></div>
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("barcode")}}</label>
                                    <input type="number" class="form-control @if($errors->has('barcode')) is-invalid @endif"  name="barcode" placeholder="{{__("enter-barcode")}}"  value="{{inputValue("barcode",$item)}}">
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__('English Item Description')}}</label>
                                    <textarea class="form-control @if($errors->has('description_en')) is-invalid @endif" type="text" name="description_en" style="height: 120px" placeholder="{{__('Enter English Description')}}" >{{inputValue("description_en",$item)}}</textarea>
                                </div>
                                @error("description_en")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__('Arabic Item Description')}}</label>
                                    <textarea class="form-control @if($errors->has('description_ar')) is-invalid @endif" type="text" name="description_ar" style="height: 120px" placeholder="{{__('Enter Arabic Description')}}">{{inputValue("description_ar",$item)}}</textarea>
                                </div>
                                @error("description_ar")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>


                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Status")}}</label>
                                    <div class="toggle-flip changes-status">
                                        <label>
                                            <input type="checkbox" class="show-menu" @if($item->status) checked @endif name="status"><span class="flip-indecator" data-toggle-on="{{__("ON")}}" data-toggle-off="{{__("OFF")}}"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
{{--                            <div class="col-lg-6">--}}
{{--                                <div class="form-group">--}}
{{--                                    <label class="control-label">{{__("price")}}</label>--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <div class="input-group-prepend">--}}
{{--                                            <div class="input-group-text">{{__("CarHub")}}</div>--}}
{{--                                        </div>--}}
{{--                                        <input class="form-control @if($errors->has('car_hub')) is-invalid @endif" type="text" name="car_hub" placeholder="{{__("Enter price")}}" value="{{inputValue("car_hub", $item->prices)}}">--}}
{{--                                    </div>--}}
{{--                                    @error("car_hub")--}}
{{--                                    <div class="input-error">{{$message}}</div>--}}
{{--                                    @enderror--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <div class="input-group-prepend">--}}
{{--                                            <div class="input-group-text">{{__("PickUp")}}</div>--}}
{{--                                        </div>--}}
{{--                                        <input class="form-control @if($errors->has('pick_up')) is-invalid @endif" type="text" name="pick_up" placeholder="{{__("Enter price")}}" value="{{inputValue("pick_up", $item->prices)}}">--}}
{{--                                    </div>--}}
{{--                                    @error("pick_up")--}}
{{--                                    <div class="input-error">{{$message}}</div>--}}
{{--                                    @enderror--}}
{{--                                    <div class="input-group">--}}
{{--                                        <div class="input-group-prepend">--}}
{{--                                            <div class="input-group-text">{{__("Delivery")}}</div>--}}
{{--                                        </div>--}}
{{--                                        <input class="form-control @if($errors->has('delivery')) is-invalid @endif" type="text" name="delivery" placeholder="{{__("Enter price")}}" value="{{inputValue("delivery", $item->prices)}}">--}}
{{--                                    </div>--}}
{{--                                    @error("delivery")--}}
{{--                                    <div class="input-error">{{$message}}</div>--}}
{{--                                    @enderror--}}
{{--                                </div>--}}
{{--                            </div>--}}
                            <div class="col-6 addons" style="@if(!$addOns || count($addOns) == 0) display:none @endif">
                                <div class="form-group">
                                  <div class="row">
                                      <div class="col-4">
                                          <label class="control-label">{{__("Select Block Addons")}}</label>
                                      </div>
                                  </div>


                                    <div class="table-responsive overtable">
                                        <table class="table table-fixed">
                                            <thead class=" text-secondary">
                                            <th></th>
                                            <th>{{__('name')}}</th>
                                            </thead>
                                            <tbody id="add_ons">
                                                @foreach($addOns as $addOn)
                                                    <tr>
                                                            <td><input type="checkbox" @if(isset($blocAddon[$addOn->id])) checked @endif name="addOns[]" value="{{ $addOn->id }}"></td>
                                                            <td>{{ $addOn->name }}</td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Item Photo")}}</label>
                                    <div>
                                        <button class="btn btn-primary form-control button-upload-file" >
                                            <input class="input-file show-uploaded" data-upload-type="single" data-imgs-container-class="uploaded-images" type="file" name="main_image">
                                            <span class="upload-file-content">
                                                <i class="fas fa-upload fa-lg upload-file-content-icon left"></i>
                                                <span class="upload-file-content-text">{{__("Upload Photo")}}</span>
                                            </span>
                                        </button>
                                    </div>
                                </div>
                                @error("main_image")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-3 col-md-5 col-sm-6">
                                <div class="uploaded-images" style="margin-bottom: 20px;">
                                    @if(isset($item->getFirstMediaFile()->url))
                                    <div class="img-container">
                                        <img src="{{ $item->getFirstMediaFile()->url }}" alt="">
                                    </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-lg-6 col-md-6 col-sm-12">
                                <div class="form-group">
                                    <label class="control-label">{{__("Select Branch")}}</label>
                                    <div class="table-responsive overtable">
                                        <table class="table table-fixed">
                                            <thead class=" text-secondary">
                                            <th><input type="checkbox" @if(count(old('branches[]', $item->branches->pluck('id')->toArray())) == count($branches)) checked @endif class="checkedAll"></th>
                                            <th>{{__('Branch Name')}}</th>
                                            </thead>
                                            <tbody>
                                            @foreach($branches as $branch)
                                                <tr>
                                                    <td>
                                                        <input {{ in_array($branch->id, old('branches[]', $item->branches->pluck('id')->toArray())) ? 'checked' : '' }} class="check" type="checkbox" name="branches[]" value="{{ $branch->id }}">
                                                    </td>
                                                    <td>{{ $branch->name }}</td>
                                                </tr>
                                            @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                @error("branches")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-12">
                                <div class="form-group">
                                    <label class="control-label">{{__("Select Food Allergy")}}</label>
                                    <div class="table-responsive overtable">
                                        <table class="table table-fixed">
                                            <thead class=" text-secondary">
                                            <th><input type="checkbox" @if(count(old('food_allergies[]', $item->foodAllergy->pluck('id')->toArray())) == count($food_allergies)) checked @endif class="checkedAllFood"></th>
                                            <th>{{__('Image')}}</th>
                                            </thead>
                                            <tbody>
                                            @foreach($food_allergies as $food_allergy)
                                                <tr>
                                                    <td>
                                                        <input {{ in_array($food_allergy->id, old('food_allergies[]', $item->foodAllergy->pluck('id')->toArray())) ? 'checked' : '' }} class="checkFood" type="checkbox" name="food_allergies[]" value="{{ $food_allergy->id }}">
                                                    </td>
                                                    <td><img src="{{$food_allergy->getFirstMediaFile() ? $food_allergy->getFirstMediaFile()->url : null}}" width="80" height="80"></td>
                                                </tr>
                                            @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                @error("food_allergies")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="tile-footer">
                            <button class="btn btn-primary" type="submit"><i class="fa fa-fw fa-lg fa-check-circle"></i> {{__("Save")}}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection

@section("scripts")
    <script type="text/javascript">
        $(".checkedAll").on("click", function (){
            let check = $(this).is(':checked');
            if(check){
                $(".check").attr("checked", true);
            }else{
                $(".check").removeAttr("checked");
            }
        })

        $(".checkedAllFood").on("click", function (){
            let check = $(this).is(':checked');
            if(check){
                $(".checkFood").attr("checked", true);
            }else{
                $(".checkFood").removeAttr("checked");
            }
        })

        $("#get-addons").on("change", function (){
            let categoryId = $(this).val(), url = $(this).data("url");
            if(categoryId){
                $.ajax({
                    type: "GET",
                    url: url,
                    data:{category_id: categoryId}, // serializes the form's elements.
                    success: function(response)
                    {
                        let htmlElements = '';
                        for (addOn of response.data){
                            htmlElements += `<tr><td><input type="checkbox" name="addOns[]" value="${addOn.id}"></td><td>${addOn.name}</td></tr>`;
                        }
                        $("#add_ons").empty().append(htmlElements);
                        $(".addons").fadeIn();
                    },
                    error:function(){
                        console.error("you have error");
                    }
                });
            }else{
                $("#add_ons").empty();
                $(".addons").fadeOut();
            }
        })
    </script>
@endsection