@extends('admin.layout')
@section('content')
    <style>
        [type=radio].with-gap.radio-col-primary:checked+label:before {
            border: 2px solid #fb753d !important;
        }

        [type=radio].with-gap.radio-col-primary:checked+label:after {
            background-color: #fb753d !important;
            border: 2px solid #fb753d !important;
        }

        input[type=text],
        input[type=search],
        input[type=number],
        input[type=email] {
            border-radius: 40px !important;
        }

        .active-radio {
            border: 2px solid #fb753d;
        }

        #payByViza,
        #payByBankTransfer {
            display: none;
        }

        .bank-box-border {
            border: 2px solid #fb753d;
        }

    </style>
    @php
    $total = 0;
    @endphp
    <section class="content" style="margin-top: 3em">
        <div class="row">
            <div class="col-lg-4 col-md-4 col-12">
                @if (Session::has('cart'))
                    @if (count($cart = Session::get('cart')) > 0)
                        @foreach ($cart as $key => $cartItem)
                            @php
                                $total += $cartItem['price'];
                            @endphp

                            <div class="box text-center" style="background-color: #fb753d;box-shadow: none !important;">
                                <div class="box-body" style="color: #FFFFFF;padding: 1em 2em 2em 2em;">
                                    <div class="text-center">
                                        <img style="width: 3em;height: 3em;margin-bottom: 1em;"
                                            src="{{ $cartItem['image'] }}" alt="">
                                    </div>
                                    <h5 class="text-center">
                                        {{ $cartItem['title_ar'] }}
                                    </h5>
                                    <h5 class="text-center">
                                        <span class="ser_mod_price"
                                            usprice="{{ $cartItem['price'] }}">{{ $cartItem['price'] }}</span>
                                        <span class="ser_mod_symbol"></span>

                                    </h5>
                                </div>
                            </div>
                        @endforeach
                    @else
                        <div class="box text-center" style="background-color: #fb753d;box-shadow: none !important;">
                            <div class="box-body" style="color: #FFFFFF;padding: 1em 2em 2em 2em;">
                                <div>{{ translate('Your Cart is empty') }}</div>
                            </div>
                        </div>

                    @endif
                @else
                    <div class="box text-center" style="background-color: #fb753d;box-shadow: none !important;">
                        <div class="box-body" style="color: #FFFFFF;padding: 1em 2em 2em 2em;">
                            <div>{{ translate('Your Cart is empty') }}</div>
                        </div>
                    </div>
                @endif
            </div>
            <div class="col-lg-8 col-md-8 col-12">
                <div class="box" style="box-shadow: none !important;">
                    <div class="box-header box-header-custem">
                        <div class="app-menu">
                            <div class="row">
                                <div class="col-lg-6 col-6">
                                    <h3>{{ translate('Total amount') }}:
                                        <span class="ser_mod_price"
                                            usprice="{{ $total }}">{{ $total }}</span>
                                        <span class="ser_mod_symbol"></span>
                                    </h3>
                                </div>
                                <div class="col-lg-6 col-6" style="text-align: end">
                                    <div class="form-group row">
                                        <label for="currencies" class="col-md-4"
                                            style="line-height: 3em">{{ translate('Choose Currency') }}
                                        </label>
                                        <div class="col-md-8">
                                            <select name="currencies" id="currencies" class="form-control">
                                                @foreach ($currencies as $currency)
                                                    @if ($currency['code'] == Session::get('managerCurencies')[$currentTenant->fav_manager_currency]['code'])
                                                        <option selected mid="{{ $currency['id'] }}"
                                                            value="{{ $currency['exchange_rate'] }}"
                                                            symbol="{{ managerRtl() == true ? $currency['symbol_ar'] : $currency['symbol_en'] }}">
                                                            {{ managerRtl() == true ? $currency['name_ar'] : $currency['name_en'] }}
                                                        </option>
                                                    @else
                                                        <option mid="{{ $currency['id'] }}"
                                                            value="{{ $currency['exchange_rate'] }}"
                                                            symbol="{{ managerRtl() == true ? $currency['symbol_ar'] : $currency['symbol_en'] }}">
                                                            {{ managerRtl() == true ? $currency['name_ar'] : $currency['name_en'] }}
                                                        </option>
                                                    @endif

                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="box-body">
                        <div class="row">
                            <div class="col-md-6 col-lg-6 col-12 mx-auto">
                                <div class="form-group row">
                                    <label for="currencies" class="col-md-4"
                                        style="line-height: 3em">{{ translate('Choose payment type') }}
                                    </label>
                                    <div class="col-md-8">
                                        <select name="bank_transfer_visa" id="bank_transfer_visa" class="form-control">
                                            <option selected disabled value="0">
                                                {{ translate('Choose payment type') }}
                                            </option>
                                            <option value="bank_transfer">
                                                {{ translate('Bank transfer') }}
                                            </option>
                                            <option value="visa">
                                                {{ translate('Visa') }}
                                            </option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br>
                        <div id="payByBankTransfer">
                            {!! Form::open(['method' => 'post', 'action' => 'Admin\AddonController@continuPayment', 'files' => true]) !!}
                            <input type="hidden" name="payment_method" value="bank_transfer">
                            <input type="hidden" name="fav_manager_currency" class="fav_manager_currency"
                                value="{{ $currentTenant->fav_manager_currency }}">
                            <input type="hidden" name="bank_id" id="bank_id"
                                value="{{ sizeof($banks) > 0 ? $banks[0]['id'] : 0 }}">

                            <div class="banks-container">
                                <div class="row">
                                    @foreach ($banks as $key => $bank)
                                        <div class="col-4 col-md-4 col-xl-4">
                                            <div class="box box-link-pop text-center bank-box {{ $key == 0 ? 'bank-box-border' : '' }}"
                                                mid="{{ $bank['id'] }}" id="bank_{{ $bank['id'] }}"
                                                style="cursor: pointer">
                                                <div class="box-body">
                                                    <div class="text-center">
                                                        <img style="width: 6em;height: 4em;"
                                                            src="{{ url(getExternalRouts()['mangerRout'] . $bank['photo']) }}"
                                                            alt="">
                                                    </div>
                                                    <h6>{{ managerRtl() == true ? $bank['name_ar'] : $bank['name_en'] }}
                                                    </h6>
                                                    <h6><span>{{ translate('User name') }}:</span>
                                                        {{ $bank['user_name'] }}</h6>
                                                    <h6><span>{{ translate('Account number') }}:</span>
                                                        {{ $bank['account_number'] }}</h6>
                                                    <h6><span>{{ translate('IPAN') }}:</span> {{ $bank['ipan_code'] }}
                                                    </h6>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach

                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-8 col-md-8 col-sm-12 mx-auto">
                                    <div class="custom-file-container">
                                        <div class="custom-file">
                                            <input required type="file" name="payment_attach" class="custom-file-input"
                                                id="payment_attach">
                                            <label class="custom-file-label"
                                                for="payment_attach">{{ translate('Payment attach') }}</label>
                                        </div>

                                        <div class="bg-lightest p-10 rounded5 dvPreview text-center"
                                            style="width: 100%;margin-top: 1em;height: 10em;">
                                            <img style="max-width: 100%;height: 100%;"
                                                src="{{ url('/images/noimg.png') }}" alt="">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <br>
                            <div>
                                <button type="submit"
                                    class="waves-effect waves-light btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                    style="width: 100%;">{{ translate('Continu payment') }}</button>
                            </div>
                            {!! Form::Close() !!}
                        </div>
                        <div id="payByViza">
                            {!! Form::open(['method' => 'post', 'action' => 'Admin\AddonController@continuPayment', 'files' => true]) !!}
                            <input type="hidden" name="payment_method" value="visa">
                            <input type="hidden" name="fav_manager_currency" class="fav_manager_currency"
                                value="{{ $currentTenant->fav_manager_currency }}">
                            <div class="row">
                                <div class="col-10">
                                    <div class="form-group">
                                        <div>
                                            {!! Form::number('card_num', null, ['class' => 'form-control', 'placeholder' => translate('Card number')]) !!}
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-6">
                                            <div class="form-group">
                                                <div>
                                                    {!! Form::number('cvv', null, ['class' => 'form-control', 'placeholder' => translate('CVV')]) !!}
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-6">
                                            <div class="form-group">
                                                <div>
                                                    {!! Form::text('end_date', null, ['class' => 'form-control', 'placeholder' => translate('Card Expiry Date (11/25)')]) !!}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br>
                                    <div class="row">
                                        <div class="col-8">
                                            <h6>
                                                {{ translate('Payment methods available') }}
                                                <img src="{{ url('/images/mastercard.png') }}" alt="">
                                                <img src="{{ url('/images/visa.png') }}" alt="">
                                            </h6>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <br>
                            <div>
                                <button type="submit"
                                    class="waves-effect waves-light btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                    style="width: 100%;">{{ translate('Continu payment') }}</button>
                            </div>
                            {!! Form::Close() !!}
                        </div>


                    </div>

                </div>
            </div>
        </div>
    </section>
@endsection
@section('script')
    <script type="text/javascript">
        var ext_rate = $('#currencies').val();
        var symbol = $('option:selected', '#currencies').attr('symbol');
        $('.ser_mod_symbol').text(symbol);
        $(".ser_mod_price").each(function(index) {
            $(this).text($(this).attr('usprice') * ext_rate);
        });
        $('#currencies').change(function() {
            $('.fav_manager_currency').val($('option:selected', this).attr('mid'));
            ext_rate = $(this).val();
            symbol = $('option:selected', this).attr('symbol');
            $('.ser_mod_symbol').text(symbol);
            $(".ser_mod_price").each(function(index) {
                $(this).text($(this).attr('usprice') * ext_rate)
            });
        })

        $('#bank_transfer_visa').change(function() {

            if ($(this).val() == 'bank_transfer') {
                $('#payByViza').hide();
                $('#payByBankTransfer').show();
            } else {
                $('#payByBankTransfer').hide();
                $('#payByViza').show();
            }

        })

        $('.bank-box').click(function() {
            var mid = $(this).attr('mid');
            $('#bank_id').val(mid);
            $('.bank-box').removeClass('bank-box-border');
            $('#bank_' + mid).addClass('bank-box-border');
        })
    </script>
@endsection