@extends('web.layouts.app')
@section('title','قائمة المفضلة')
@section('content')
    <!-- start form for login -->
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="account_head">
                    <ul>
                        <li class="l1 ">
                            <a href="{{route('my_account')}}">
                                حسابي
                            </a>
                        </li>
                        <li class="l2 l1 ">
                            <a href="{{route('my_wallet')}}">
                                مشتراتي
                            </a>
                        </li>
                        <li class="l1 li_active1">
                            <a href="{{route('my_favorites')}}">
                                مفضلاتي
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div id="item_favourite" style="width: 100%;">
                @include('web.users.favorite_items')
            </div>
            <div class="ajax-load text-center" style="display:none;    margin: 0 auto;
    min-height: 150px;
    margin-top: 100px;">
                <p><img style="width: 40px;" src="{{asset('web/img/loading_image.gif')}}"></p>
            </div>
        </div>
    </div>

@endsection


@section('script')

    <script>

        function favorite(id) {

            console.log(id);

            $.ajax({
                type: 'POST',
                url: '{{route('favorite_ajax')}}',
                data: {item_id: id},
                beforeSend: function () {
                    $("#item_favourite").html('');
                    $('.ajax-load').show();
                },
                success: function (data) {
                    console.log(data.html);
                    $('.ajax-load').hide();
                    $("#item_favourite").append(data.html);
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    errorFunction();
                }
            });

        }


    </script>

@endsection