@extends('website.layout.master')



@section('title')



@endsection



@section('content')





        <!-- page-title -->

        <section class="page-title centred"> 

            <div class="pattern-layer" style="background-image:url(website/images/background/page-title.jpg);"></div>

            <div class="auto-container">

                <div class="content-box">

                    <h1>Checkout</h1>

                    <ul class="bread-crumb clearfix">

                        <li><i class="flaticon-home-1"></i><a href="{{route('home')}}">Home</a></li>

                        <li>Checkout</li>

                    </ul>

                </div>

            </div>

        </section>

        <!-- page-title end -->





                <!-- checkout-section -->

                <section class="checkout-section">
                    <form method="POST" action="{{ route('checkout_proceed') }}" enctype="multipart/form-data" class="billing-form">

                            @csrf

            <div class="container">

                <div class="row">
<!-- 
                    <div class="col-lg-12 col-md-12 col-sm-12 upper-column">

                        <div class="upper-box">

                            <div class="customer single-box">Returning Customer? <a href="{{route('login')}}">Click here to Login</a></div>

                        </div>

                    </div> -->

                </div>

                <div class="row">

                    <div class="col-lg-6 col-md-12 col-sm-12 left-column">

                        <div class="inner-box">

                            <div class="billing-info">

                                <h4 class="sub-title">Billing Details</h4>

                                <form action="#" method="post" class="billing-form">

                                    <div class="row">

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>First Name*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="first_name" >

                                            </div>

                                        </div>

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>Last Name*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="last_name">

                                            </div>

                                        </div>

                                        <div class="col-lg-12 col-md-12 col-sm-12 form-group">

                                            <label>Company Name*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="company_name">

                                            </div>

                                        </div>

                                        <div class="col-lg-12 col-md-12 col-sm-12 form-group">

                                            <label>Email Address*</label>

                                            <div class="field-input">

                                                <input type="email" name="email">

                                            </div>

                                        </div>

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>Phone Number*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="phone">

                                            </div>

                                        </div>

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>Country*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="country">

                                            </div>

                                        </div>

                                        <div class="col-lg-12 col-md-12 col-sm-12 form-group">

                                            <label>Address*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="address" class="address">

                                      

                                            </div>

                                        </div>

                                        <div class="col-lg-12 col-md-12 col-sm-12 form-group">

                                            <label>Town/City*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="town_city">

                                            </div>

                                        </div>

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>State*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="state">

                                            </div>

                                        </div>

                                        <div class="col-lg-6 col-md-6 col-sm-12 form-group">

                                            <label>Zip Code*</label>

                                            <div class="field-input">

                                                <input type="text" required="" name="zip">

                                                <input type="hidden" value="{{ $session_id }}" name="session_id">


                                            </div>

                                        </div>

                                        <div class="form-group col-lg-12 col-md-12 col-sm-12">


                                        </div>

                                    </div>

                                </form>

                            </div>

                            <div class="additional-info">

                                <div class="note-book">

                                    <label>Order Notes</label>

                                    <textarea name="note_box" placeholder="Notes about your order, e.g. special notes for your delivery"></textarea>

                                </div>

                            </div>

                        </div>

                    </div>

                    <div class="col-lg-6 col-md-12 col-sm-12 right-column">

                        <div class="inner-box">

                            <div class="order-info">

                                <h4 class="sub-title">Your Order</h4>

                                <div class="order-product">

                                    <ul class="order-list clearfix">

                                        <li class="title clearfix">

                                            <p>Product</p>

                                            <span>Total</span>

                                        </li>

                                        @php
                                    $subtotal = 0;
                                    @endphp

                                    @foreach($addedproducts as $pro)

                                    @php
                                    $subtotal += $pro->quantity * $pro->price;
                                    @endphp

                                        <li>

                                            <div class="single-box clearfix">

                                                <img src="{{ URL::asset('admin/assets/uploads/'.$pro->image)}}" alt="">

                                                <h6>{{ $pro->name.' ( '.$pro->quantity.'x )' }}</h6>

                                                <span>{{ $pro->price*$pro->quantity }} PKR</span>

                                            </div>

                                        </li>

                                        @endforeach

                                        
                                        <li class="sub-total clearfix">

                                            <h6>Sub Total</h6>

                                            <span>{{ $subtotal }} PKR</span>

                                        </li>

                                        <li class="order-total clearfix">

                                            <h6>Order Total</h6>

                                            <span>{{ $subtotal }} PKR</span>

                                        </li>

                                    </ul>

                                </div>

                            </div>
                            <input type="hidden" value="{{ $subtotal }}" name="price">


                            <div class="payment-info">

                                <h4 class="sub-title">Payment Proccess</h4>

                                <div class="payment-inner">

                                    <!-- <div class="option-block">

                                        <div class="custom-controls-stacked">

                                            <label class="custom-control material-checkbox">

                                                <input type="checkbox" class="material-control-input">

                                                <span class="material-control-indicator"></span>

                                                <span class="description">Direct bank transfer</span>

                                            </label>

                                        </div>

                                    </div> -->
<!-- 
                                    <div class="option-block">

                                        <div class="custom-controls-stacked">

                                            <label class="custom-control material-checkbox">

                                                <input type="checkbox" class="material-control-input">

                                                <span class="material-control-indicator"></span>

                                                <span class="description">Paypal</span>

                                            </label>

                                        </div>

                                    </div> -->

                                    <div class="option-block">

                                        <div class="custom-controls-stacked">

                                            <label class="custom-control material-checkbox">

                                                <input type="checkbox" class="material-control-input" checked>

                                                <span class="material-control-indicator"></span>

                                                <span class="description">Cash on Delivery</span>

                                            </label>

                                        </div>

                                    </div>

                                    <div class="btn-box">



                                    <button type="submit" class="theme-btn-one">Place order<i class="flaticon-right-1"></i></button>




                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

        </form>

        </section>

        <!-- checkout-section end -->



@endsection