@extends('home.layouts.index')

@section('title')
    صفحه ای پروفایل
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('home/css/profile_panel.css') }}">

    <style>
        .img-thumbnail {
            width: 40px !important;
            height: auto !important;
            margin-right: 10px;
        }

        .cursor-pointer {
            cursor: pointer;
        }

        td {
            font-size: 10pt;
            padding: 0;
            vertical-align: middle;
        }

        th {
            text-align: center;
        }

        .bg-light-danger {
            background-color: #ff9a9a;
        }

        .bg-light-success {
            background-color: #b2ecb2;
        }

        @media (min-width: 576px) {
            .modal-dialog {
                max-width: 1000px !important;
                margin: 1.75rem auto;
            }
        }
        .bg-light-warning{
            background-color: #dada2b;
        }
    </style>
@endsection

@section('script')
    <script>
        // Show File Name
        $('#profile_image').change(function () {
            //get the file name
            var fileName = $(this).val();
            //replace the "Choose a file" label
            $(this).next('.custom-file-label').html(fileName);
        });
        $('#close_alert').click(function () {
            $(this).parent().slideUp();
        })
    </script>
    <script>
        function showDetail(order_id) {
            let modal = $('#ordersDetails-' + order_id);
            modal.modal('show');
        }

        //remove from wishlist
        function RemoveFromProfileWishList(tag, event, productId) {
            event.preventDefault();
            $.ajax({
                url: "{{ route('home.wishlist.remove') }}",
                type: "POST",
                dataType: "json",
                data: {
                    productId: productId,
                    _token: "{{ csrf_token() }}"
                },
                success: function (msg) {
                    if (msg[0] == 'ok') {
                        swal({
                            title: "با تشکر",
                            text: "کالای مورد نظر با موفقیت از لیست علاقه‌مندی های شما حذف شد",
                            icon: "success",
                            timer: 3000,
                        })
                        window.location.reload();
                    }
                },
                error: function () {
                    console.log("something went wrong");
                },
            });
        }

        $('.province-select').change(function () {
            var provinceID = $(this).val();
            if (provinceID) {
                $.ajax({
                    type: "GET",
                    url: "{{ url('/get-province-cities-list') }}?province_id=" + provinceID,
                    success: function (res) {
                        if (res) {
                            $(".city-select").empty();

                            $.each(res, function (key, city) {
                                console.log(city);
                                $(".city-select").append('<option value="' + city.id + '">' +
                                    city.name + '</option>');
                            });

                        } else {
                            $(".city-select").empty();
                        }
                    }
                });
            } else {
                $(".city-select").empty();
            }
        });
    </script>

@endsection

@section('content')
    <main class="main-wrapper">
        <!-- Start Breadcrumb Area  -->
        <div style="background-color:#0072ff" class="axil-breadcrumb-area">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-6 col-md-8">
                        <div class="inner">
                            <ul class="axil-breadcrumb">
                                <li class="axil-breadcrumb-item"><a href="{{ route('home.index') }}">خانه</a></li>
                                <li class="separator"></li>
                                <li class="axil-breadcrumb-item active" aria-current="page">پروفایل من</li>
                            </ul>
                            <h1 style="color:#fff" class="title">همه محصولات را کاوش کنید</h1>
                        </div>
                    </div>