@extends("admin.layouts.app")
@section("styles")
<link href="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/jquery-nestable/jquery.nestable.css"
      rel="stylesheet" type="text/css"/>

@endsection
@section("content")
<div class="row">
    <div class="col-md-8">
        <div class="portlet light bordered">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-list font-green"></i>
                    <span class="caption-subject font-green bold uppercase">@lang("Accessory Feature Boxes")</span>
                </div>
                  <div class="actions">
                <a href="{{route("admin.accessoryFeaturedBox.create")}}" class="btn btn-primary">
                    <i class="fa fa-plus"></i> Create </a>
            </div>
            </div>
            <div class="portlet-body">
                <div class="table-scrollable">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th> @lang('constants.image') </th>
                                <th> @lang("constants.title") </th>
                                <th > @lang("Update Box Position") </th>
                                <th> @lang('constants.is_active')</th>
                                <th > @lang('constants.action')</th>
                            </tr>
                        </thead>
                        <tbody>
                        {!! Form::open(['route'=>"admin.accessoryFeaturedBox.index",'method'=>"get"]) !!}
                        <tr>
                            <td style="width: 25%">

                            </td>
                            <td style="width: 100%">
                                {{Form::text("title",Request::get("title",null),['class'=>"form-filter input-sm form-control"])}}
                            </td>

                            <td style="width: 85%">
                                {{Form::select("accessory_category_id",IHouse::getFeaturedParentAccessoryCategories(),Request::get("accessory_category_id",null),['class'=>"form-filter input-sm form-control","placeholder"=>"All"])}}

                            </td>
                            <td style="width: 30%">
                                {!! Form::select("is_active",["active"=>"Active","not-active"=>"Not Active"],Request::get("is_active",null),['class'=>"form-filter input-sm form-control","placeholder"=>"All"])!!}

                            </td>

                            <td style="display: flex">
                                <button type="submit" class="btn btn-sm btn-success filter-submit margin-bottom">
                                    <i class="fa fa-search"></i> Search
                                </button>
                                <a href="{{route("admin.accessoryFeaturedBox.index")}}"
                                   class="btn btn-sm btn-info filter-submit margin-bottom">
                                    <i class="fa fa-refresh"></i> Reset</a>

                            </td>
                        </tr>

                        {!! Form::close() !!}
                        @forelse($featured_boxes as $featuredBox)
                            <tr>
                                <td>

                                    <img alt="Image" src="{{ url('https://cdn.ihouse.ps/' . $featuredBox->image) }}" style="max-width: 100%;">
                                </td>
                                <td>
                                    {{$featuredBox->title}}
                                </td>
                                <td>
                                    {{Form::open(['route'=>["admin.accessoryFeaturedBox.updateBoxPosition",'id'=>$featuredBox->accessory_category_id]])}}
                                    {{Form::select("accessory_category_id",IHouse::getFeaturedParentAccessoryCategories(),$featuredBox->accessory_category_id,['class'=>"select2 form-control",'id'=>'updateBoxPosition','data-featured_box_id'=>$featuredBox->id])}}
                                    {!! Form::close() !!}
                                </td>

                                <td class="text-center">
                                    <a href="#" data-type="is_active" data-class="AccessoryBoxFeatures"
                                       data-id="{{$featuredBox->id}}" id="{{$featuredBox->id}}"
                                       class="attribute is-active">@if ($featuredBox->is_active)
                                            <i class="fa fa-check text-success fs15 pr5"></i>
                                        @else
                                            <i class="fa fa-times text-danger fs15 pr5"></i>
                                        @endif</a>
                                </td>

                                <td>
                                    {{Form::open(['route'=>["admin.accessoryFeaturedBox.destroy",$featuredBox->id],'method'=>"delete"])}}
                                    <a href="{{route("admin.accessoryFeaturedBox.edit",$featuredBox->id)}}" class="btn btn-outline btn-sm purple" title="Edit"><i class="fa fa-edit"></i> @lang("constants.edit")</a>
                                    <button onclick="return confirm('are you sure?')" type="submit" class="btn btn-outline btn-sm red" title="Delete"><i class="fa fa-trash"></i> @lang("constants.delete")</button>
                                    {!! Form::close() !!}
                                </td>
                            </tr>
                            @empty
                            @endforelse
                        </tbody>
                         <tfoot>
                            <tr>
                                <td colspan="5">
                                    {!! $featured_boxes->appends($appends)->links()!!}
                                </td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section("scripts")
{{--        <script src="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/jquery-nestable/jquery.nestable.js"--}}
{{--                type="text/javascript"></script>--}}
{{--        <script type="text/javascript">--}}
{{--            $(document).ready(function () {--}}
{{--                $('#list').nestable({maxDepth: 1});--}}
{{--                update_out('#list', "#reorder");--}}

{{--                $('#list').on('change', function () {--}}
{{--                    var out = $('#list').nestable('serialize');--}}
{{--                    $('#reorder').val(JSON.stringify(out));--}}
{{--                });--}}



{{--    });--}}

{{--    function update_out(selector, sel2){--}}
{{--        var out = $(selector).nestable('serialize');--}}
{{--        $(sel2).val(JSON.stringify(out));--}}
{{--    }--}}

{{--</script>--}}
@include("admin.layouts.update_attribute")
    <script>
        $(document).on('change','#updateBoxPosition',function (e){
            e.preventDefault()
            let featuredBoxId = $(this).data('featured_box_id')
            let accessory_category_id = $(this).val()

            $.ajax({
                type: "POST",
                url:'{{route('admin.accessoryFeaturedBox.updateBoxPosition')}}',
                data: {
                    featuredBoxId:featuredBoxId,accessory_category_id:accessory_category_id
                },
                success: function (data) {
                    toastr["success"]("Position Updated Successfully");

                    toastr.options = {
                        "closeButton": true,
                        "debug": false,
                        "positionClass": "toast-top-right",
                        "onclick": null,
                        "showDuration": "1000",
                        "hideDuration": "1000",
                        "timeOut": "5000",
                        "extendedTimeOut": "1000",
                        "showEasing": "swing",
                        "hideEasing": "linear",
                        "showMethod": "fadeIn",
                        "hideMethod": "fadeOut"
                    }
                }
            });
        })
    </script>
@endsection