@extends('layouts.app')

@section('content')

<div class='container'>
    <div class='row mt-5 d-flex justify-content-center'>
      <div class='col-md-7 text-center'>
        <h2>Your Package on your given radius is given below.</h3>
      </div>
    </div>
    <div class='row mt-5 mb-3 d-flex justify-content-center'>
    @foreach($data as $package)
        <div class='col-md-3'>
            <div class='package-box mb-3'>
                <div class='package-head text-center'>
                    <h2 class='text-white'>${{$package->price}}</h2>
                    <h5 class='text-white'>{{$package->productname}}</h5>               
                </div>
                <div class='package-detail p-3 text-center'>
                    <strong>{{$package->productdescription}}</strong>
                </div>
                <div class='package-btn-box text-center'>
                    <input type='hidden' value='{{$package->id}}' class='pid'> 
                    <!-- <a class='btn btn-success pid-btn' href="order/{{$package->id}}">Select Package</a> -->
                    <form method='post' action='{{ route("order") }}'>
                        @csrf
                        <input type='hidden' name='pid' value='{{$package->id}}'/>
                        <button class='btn btn-success' type='submit'>Select Package</button>
                    </form>
                </div>
            </div>
            @if($closer != '961' && $closer != '')
            <a class='text-primary text-center d-block' id='coupon-btn'>Click here if you have discount coupon?</a>
            @endif
           
            @if (Session::has('error'))
                <div class='alert alert-danger alert-dismissible fade show' role='alert'>
                {{ Session::get('error') }}
                </div>
                @endif
        </div>
    @endforeach
    </div>
    
    @foreach($coupon as $coupondata)
    <div class='row d-flex justify-content-center'>
        <div class='col-md-4'>
        <p style='font-size:13px;' class='text-center'>You have already applied coupon on this product. If you want to use another coupon you need to remove current coupon code.</p>
        <a class='d-block text-end link-danger' href='{{ route("removecoupon", $coupondata["pc_id"]) }}'>remove discount</a>
        <div class='discount-div'>
                <table>
                        <tr>
                            <th>Coupon Code:</th>
                            <td>{{$coupondata["code"]}}</td>
                        </tr>
                        <tr>
                            <th>Price:</th>
                            <td>${{$coupondata["price"]}}</td>
                            </tr>
                        <tr>
                            <th>Discount:</th>
                            <td>-{{$coupondata["discount_price"]}}</td>
                            </tr>
                        <tr>
                            <th>New Price:</th>
                            <td>${{$coupondata["new_discount_price"]}}</td>
                        </tr>
                    </table>
                    <form action='{{ route("update-product-coupon") }}' method='POST'>
                        @csrf
                    <input name='couponid' id='couponid' value='{{$coupondata["couponid"]}}' hidden>   
                    <input name='productid' id='productid' value='{{$coupondata["productid"]}}' hidden>    
                    <input name='newprice' id='newdprice' value='{{$coupondata["new_discount_price"]}}' hidden>
                    <input name='bid' id='bid' value='{{$coupondata["bid"]}}' hidden>
                    <input name='pid' id='pid' value='{{$coupondata["pc_id"]}}' hidden>    
                    <button type='submit' class='m-auto d-block btn btn-success'>Continue with discount</button>
                    </form>
                    </div>     
    </div>
    </div>
    @endforeach
               
    <div class='row d-flex justify-content-center mb-3'>
        <div class='col-md-4'>

            <form action='' id='coupon-form' style='display:none;'>
                @csrf
                <span class='coupon-alert mt-1 text-danger' style='display:none;'> Coupon Code is invalid   </span>
                <span class='coupon-alert-success mt-1 text-success' style='display:none;'>Coupon Code Applied</span>
                <span class='coupon-alert-exist mt-1 text-danger' style='display:none;'>Coupon Code Already Applied</span>
                <span class='coupon-price-alert mt-1 text-danger' style='font-size:13px;display:none;'>Error: Coupon price is greater than product price.</span>
                <div class='form-group d-flex coupon-inner'>
                @foreach($data as $pckg)
                <input id='prdctid' name='productid' value='{{$pckg->id}}' hidden>
                @endforeach
                <input type='text' class='form-control rounded-0' name='coupon' id='couponcode' placeholder='Enter Coupon Code'>    
                <input name='clsr' id='clsr' value='{{$closer}}' hidden>
                <button class='btn btn-primary rounded-0' type='submit'>Apply</button>
                </div>
            </form>
            <div class='coupon-disount-detail mt-2' style='display:none;'>

            <div class='discount-div'>
                <table>
                        <tr>
                            <th>Discount:</th>
                            <td id='discount_price'></td>
                            </tr>
                        <tr>
                            <th>New Price:</th>
                            <td id='newprice'></td>
                        </tr>
                    </table>
                    </div>  
                <form action='{{ route("add-product-coupon") }}' method='post'>
                    @csrf
                <input name='couponid' id='couponid' hidden>   
                <input name='pid' id='pid' hidden>    
                <input name='newprice' id='newdprice' hidden>
                <input name='clsr' id='clsr' value='{{$closer}}' hidden>
                <input name='bid' id='bid' value='{{$bid}}' hidden>
                <button type='submit' class='m0-auto d-block btn btn-success'>Continue with discount</button>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- <script>
    $(document).ready(function(){
     $('.pid-btn').click(function(){
        sessionStorage.setItem('productid', $('.pid').val());
     });
    });
</script> -->

<script>

    $(document).ready(function(){
        $('#coupon-btn').click(function(){
            $('#coupon-form').show();
        });
    });

    $('#coupon-form').on('submit', function(e) {
        e.preventDefault(); // Prevent the default form submission behavior

        var formData = $(this).serialize(); // Serialize form data

        $.ajax({
            type: 'GET',
            url: '{{URL::to('check-coupon')}}',
            data: formData, // Pass serialized form data
            success: function(response) {
                if (response == 'invalid coupon') {
                    $('.coupon-alert-success').hide();
                    $('.coupon-disount-detail').hide();
                    $('.coupon-disount-exist').hide();
                    $('.coupon-alert').show();
                }
                else if(response == 'exist'){
                    $('.coupon-alert-exist').show();
                }
                else if(response == 'greaterprice'){
                    $('.coupon-price-alert').show();
                    $('.coupon-alert').hide();
                }
                 else {
                    $('.coupon-disount-detail').show();
                    $('#oldprice').text(response.oldprice);
                    $('#discount_price').text('-'+response.discountprice);
                    $('#newprice').text(response.new_price);
                    $('#newdprice').val(response.new_price);
                    $('#couponid').val(response.couponid);
                    $('#pid').val(response.productid);
                    $('.coupon-alert,.coupon-price-alert').hide();
                    $('.coupon-alert-success').show();
                }
            }
        });
    });

</script>


@endsection