@extends('views.layouts.master')

@section('content')

		<!--=====================================
                    BANNER PART START
        =======================================-->
        <section class="inner-section single-banner">
            <div class="container">
                <h2>wishlist</h2>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/">Home</a></li>
                    <li class="breadcrumb-item active" aria-current="page">wishlist</li>
                </ol>
            </div>
        </section>
        <!--=====================================
                    BANNER PART END
        =======================================-->


        <!--=====================================
                    WISHLIST PART START
        =======================================-->
        <section class="inner-section wishlist-part">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="table-scroll table-responsive">
                            <table class="table-list">
                                <thead>
                                    <tr>
                                        <th scope="col">Serial</th>
                                        <th scope="col">Product</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">Price</th>
                                        <th scope="col">status</th>
                                        <th scope="col">shopping</th>
                                        <th scope="col">action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                @forelse ($listType1Book['Book'][0]['Page'] ?? [] as $wish)
                                    <tr>
                                        <td class="table-serial"><h6>{{ $wish['C3'] }}</h6></td>
                                        <td class="table-image"><img src="{{ env('MEDIA_URL') . $wish['C2']  }}" alt="product"></td>
                                        <td class="table-name"><a href="{{ route('item-details', $wish['C9'] ?: $wish['C1']) }}"><h6>{{ $wish['C4'] }}</h6></a></td>
                                        <td class="table-price"><h6>{{ number_format($wish['C6']) }} 원<!--<small>/kilo</small>--></h6></td>
{{--                                        <td class="table-status"><h6 class="stock-out">품절</h6></td>--}}
                                        <td class="table-status"><h6 class="stock-in">재고있음</h6></td>
                                        <td class="table-shop">
                                            <form class="form-prevent-multiple-submits" action="{{ route('cart.store') }}" method="POST">
                                                @csrf
                                                <div class="product-action">
                                                    <button type="button" class="action-minus" title="Quantity Minus"><i class="icofont-minus"></i></button>
                                                    <input class="action-input" title="Quantity Number" type="text" name="cart_qty" onchange="wish_qty_update(this, {{ $wish['Id'] }})"
                                                           value="{{ (int)$wish['C7'] }}">
                                                    <button type="button" class="action-plus" title="Quantity Plus"><i class="icofont-plus"></i></button>
                                                </div>
                                                <input type="hidden" name="item_id" value="{{ $wish['C1'] }}">
                                                <button type="submit" class="product-add button-prevent-multiple-submits" title="Add to Wish">
                                                    <i class="fas fa-cart-arrow-down"></i>
                                                    카트에 담기
                                                </button>
                                            </form>
                                        </td>
                                        <td class="table-action">
{{--                                            <a class="view" href="#" title="Quick View" data-bs-toggle="modal" data-bs-target="#product-view"><i class="fas fa-eye"></i></a>--}}
                                            <form class="wish-delete-form" action="{{ route('wish-list.destroy') }}" method="POST">
                                                @csrf
                                                <input type="hidden" name="item_id" value="{{ $wish['C1'] }}">
                                                <input type="hidden" name="_method" value="delete" />
                                                <button type="submit" class="trash" title="Remove Wishlist"><i class="icofont-trash"></i></button>
                                            </form>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td class="text-center" colspan="7">위시 리스트가 비어있습니다</td>
                                    </tr>
                                @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
{{--                <div class="row">--}}
{{--                    <div class="col-lg-12">--}}
{{--                        <div class="text-center mt-5">--}}
{{--                            <button class="btn btn-outline">--}}
{{--                                더보기 +--}}
{{--                            </button>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                </div>--}}
            </div>
        </section>
        <!--=====================================
                    WISHLIST PART END
        =======================================-->

@endsection
@push('js')
    <script>
        $('.wish-delete-form').on('submit', function() {
            event.preventDefault()

            $this = (this)

            iziToast.question({
                timeout: 20000,
                close: false,
                overlay: true,
                displayMode: 'once',
                id: 'question',
                title: $('#comfirm-delete').text(),
                message: $('#can-not-recover-after-delete').text(),
                position: 'center',
                buttons: [
                    [`<button type="button"><b>${$('#delete').text()}</b></button>`, async function (instance, toast) {
                        instance.hide({ transitionOut: 'fadeOut' }, toast, 'button');

                        $($this).submit()
                    }, true],
                    [`<button type="button">${$('#cancel').text()}</button>`, function (instance, toast) {
                        instance.hide({ transitionOut: 'fadeOut' }, toast, 'button');

                    }],
                ],
            });
        });

        async function wish_qty_update($this, wish_id) {
            const qty = Number($($this).val())

            if (qty < 1) {
                $($this).val(1)
                iziToast.info({ title: 'Info', message: '수량 에러' })
                return
            }

            const wish_pick = await get_api_data('wish-pick', {
                Page : [ {  Id: Number(wish_id) } ]
            })
            const wish = wish_pick.data.Page[0]
            const wish_amt = String(Number(wish.WishPrc) * Number($($this).val()));
            const response = await get_api_data('wish-act', {
                Page : [
                    {
                        Id: Number(wish_id),
                        WishPrc: wish.WishPrc,
                        WishQty: $($this).val(),
                        WishAmt: wish_amt,
                    }
                ]
            })

            show_iziToast_msg(response.data.Page, function () {
                location.reload()
            })
        }
    </script>
@endpush