@extends('layout')

@section('title', 'Cart')

@section('meta:title', 'AccessWorld: Cart')
@section('meta:description', 'View, modify or checkout products in your cart.')

@section('header')
    <style>
        #img-bigcart {
            background: url({{ asset('/img/cart-sprite.png') }});
            background-position: 0px 11px;
            background-size: cover;
            background-repeat: no-repeat;
            width: 155px;
            height: 120px;
        }

        .btn {
            white-space: normal !important;
        }
    </style>
@stop

@section('content')
    {{-- BANNER --}}
    <section class="slick-carousel full-bleed">
        <div class="slick-carousel-item"
            style="background: url({{ asset(config('paths.banner.cart')) }}) 0 0 / cover no-repeat;">
            <div class="overlay banner-overlay-shade-top stick-top-left height-3"></div>
            <div class="row" style="height: 248px">
            </div>
            <div class="overlay banner-overlay-shade-bottom stick-bottom-left force-padding text-right"></div>
        </div>
    </section>

    <section>
        <div class="container">
            <div class="section-body">
                <div class="col-sm-4 hidden-xs">
                    <article>
                        <div id="img-bigcart" class="text-center"></div>
                        <h1>Your cart</h1>
                        <p>Do not compromise on both quality and cost.</p>
                        <p>Get hosting services that match best with your business.</p>
                        <p>Grab the opportunity now.</p>
                    </article>
                </div>
                <div class="col-sm-8 col-xs-12">
                                        <div class="card card-underline">
                        <div class="card-head">
                            <header>My Cart</header>
                        </div>
                        <div class="card-body no-padding">
                            <ul class="list divider-full-bleed">
                                <li class="tile">
                                    <div class="row padding-1">
                                        <div class="col-xs-6">Service Name</div>
                                        <div class="col-xs-3">Period</div>
                                        <div class="col-xs-3 text-right">Price</div>
                                    </div>
                                </li>
                                @foreach (Cart::content() as $rowId => $item)
                                    <li class="tile">
                                        <div class="row padding-1">
                                            @if ($discount = $item->discount)
                                                <div class="ribbon">
                                                    <span>Discounted</span>
                                                </div>
                                            @endif

                                            <div class="col-xs-6">
                                                <dl class="no-margin">
                                                    <dd class="text-light text-lg">{{ str_limit($item->name, 25) }}</dd>
                                                    <dd class="text-medium text-lg">
                                                        {{ $item->options->service->name }}
                                                        @if (!is_null($item->options->renew))
                                                            <span class="text-xs">(Renewal)</span>
                                                        @endif
                                                    </dd>
                                                </dl>
                                            </div>
                                            <div class="col-xs-3">
                                                {{ $item->options->service->slug == 'domain' || $item->options->service->slug == 'ssl-certificate' ? $item->qty . ' Year(s)' : get_actual_term($item->qty) . ' Month(s)' }}
                                            </div>
                                            <div class="col-xs-3 text-right">
                                                @if (intval($item->discount) > 0)
                                                    <s>{{ currency($item->subtotal) }}</s>
                                                @endif
                                                <p class="text-lg">
                                                    {{ currency($item->discountedTotal()) }}
                                                </p>
                                            </div>
                                        </div>
                                    </li>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="card">
                                <div class="card-body small-padding">
                                    <div class="row">
                                        <div class="col-xs-6 col-xs-offset-6">
                                            <ul class="nav nav-pills nav-stacked">
                                                <li>
                                                    Sub Total
                                                    <span class="pull-right">
                                                        {{ currency(Cart::discountedTotal()) }}
                                                    </span>
                                                </li>
                                                <li>
                                                    VAT (13%)
                                                    <span class="pull-right">
                                                        {{ currency(Cart::vat(setting('vat'))) }}
                                                    </span>
                                                </li>
                                                <li>
                                                    <div class="text-bold text-lg">
                                                        Total
                                                        <span class="pull-right">
                                                            {{ currency(round(Cart::vatTotal(setting('vat')))) }}
                                                        </span>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card">
                                <div class="card-head text-center">
                                    <header>Payment Method Connect IPS</header>
                                </div>
                                <div class="card-body small-padding">
                                    <div class="row payment-options">
                                        <div class="col-sm-12 text-center">
                                            {{-- <form action="http://uat.connectips.com:7443/connectipswebgw/loginpage" method="post">
                                                    <input type="hidden" name="MERCHANTID" id="MERCHANTID" value="{{$merch_id}}"/>
                                                    <input type="hidden" name="APPID" id="APPID" value="{{$app_id}}"/>
                                                    <input type="hidden" name="APPNAME" id="APPNAME" value="{{$app_name}}"/>
                                                    <input type="hidden" name="TXNID" id="TXNID" value="{{$trnx_id}}"/>
                                                    <input type="hidden" name="TXNDATE" id="TXNDATE" value="{{$txn_date}}"/>
                                                    <input type="hidden" name="TXNCRNCY" id="TXNCRNCY" value="{{$currency}}"/>
                                                    <input type="hidden" name="TXNAMT" id="TXNAMT" value="{{$amount}}"/>
                                                    <input type="hidden" name="REFERENCEID" id="REFERENCEID" value="{{$refId}}"/>
                                                    <input type="hidden" name="REMARKS" id="REMARKS" value="{{$remarks}}"/>
                                                    <input type="hidden" name="PARTICULARS" id="PARTICULARS" value="{{$particulars}}"/>
                                                    <input type="hidden" name="TOKEN" id="TOKEN" value="{{$token}}"/>

                                                    <button type="submit" class="btn btn-lg ink-reaction btn-info btn-block btn-checkout">
                                                        <i class="md md-shopping-cart md-2x"></i>
                                                        <p>Proceed to Checkout</p>
                                                    </button>                                                
                                                </form> --}}
                                            <form action="https://uat.connectips.com/connectipswebgw/loginpage" method="post">
                                                <br>
                                                MERCHANT ID
                                                <input type="text" name="MERCHANTID" id="MERCHANTID" value="1016" />
                                                <br>
                                                APP ID
                                                <input type="text" name="APPID" id="APPID"
                                                    value="MER-1016-APP-1" />
                                                <br>
                                                APP NAME
                                                <input type="text" name="APPNAME" id="APPNAME"
                                                    value="Access World Net" />
                                                <br>
                                                TXN ID
                                                <input type="text" name="TXNID" id="TXNID" value="AWT-002" />
                                                <br>
                                                TXN DATE
                                                <input type="text" name="TXNDATE" id="TXNDATE" value="15-03-2022" />
                                                <br>
                                                TXN CRNCY
                                                <input type="text" name="TXNCRNCY" id="TXNCRNCY" value="NPR" /> <br>
                                                TXN AMT
                                                <input type="text" name="TXNAMT" id="TXNAMT" value="100" />
                                                <br>
                                                REFERENCE ID
                                                <input type="text" name="REFERENCEID" id="REFERENCEID"
                                                    value="AWT-WEB-001" />
                                                <br>
                                                REMARKS
                                                <input type="text" name="REMARKS" id="REMARKS" value="RMKS-001" />
                                                <br>
                                                PARTICULARS
                                                <input type="text" name="PARTICULARS" id="PARTICULARS"
                                                    value="PART-001" />
                                                <br>
                                                TOKEN
                                                <input type="text" name="TOKEN" id="TOKEN"
                                                    value="PsqfBFnTfi+0jUr4ZD7s07q53wuFka0bVdpvRggwYEowSazih3EUDyZFqqsDEbK/ZhlP94YCMu5GKOl5sPFYfHJD1jlj4wggJf4j5edMDKcwPHMRwZjYrk13kxgrMoBdzO2AhBCC71xgSbsUWZxeNhj/2PAN5pCk1fb3YxiU9Z4=">
                                                <br>
                                                <input type="submit" value="Submit">
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </section>
    <style>
        form#checkout {
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            justify-content: center;
        }

        .payment-logo {
            width: 100px;
        }
    </style>
@stop

@push('scripts')
    <script src="{{ asset('js/libs/bootbox/bootbox.min.js') }}"></script>
    <script src="{{ asset('js/libs/bootbox/bootbox.min.js') }}"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            var $form = $('#checkout');
            $('.btn-checkout').click(function() {
                var $payment = $('[name=payment]:checked');
                if ($payment.val() === undefined)
                    bootbox.co('Please select a payment option before proceeding!');
                else
                    bootbox.confirm({
                        title: 'Checkout Confirmation',
                        message: 'This will redirect you to the selected payment gateway. You will be automatically redirected after the payment completes.',
                        callback: function(result) {
                            if (result)
                                $form.submit();
                        }
                    });
            });
        });
    </script>
@endpush