@extends('frontend3')

@section('styles')

    <link rel="stylesheet" href="/frontend3/medi.css">

@endsection
@section('content')
    <div id="siteContent" class="site-content">
        <div class="container" style="margin-top: 24px">


            <div class="row">
                <!-- You can make it whatever width you want. I'm making it full width
                     on <= small devices and 4/12 page width on >= medium devices -->
                <div class="col-xs-12 col-md-8">


                    <!-- CREDIT CARD FORM STARTS HERE -->
                    <div class="panel panel-default credit-card-box">
                        <div class="panel-heading display-table">
                            <div class="row display-tr">
                                <h3 class="panel-title display-td">Thông tin thanh toán</h3>
                            </div>
                        </div>
                        <div class="panel-body">
                            <form role="form" id="payment-form" method="POST" action="javascript:void(0);">
                                <div class="row">
                                    <div class="col-xs-12">
                                        <div class="form-group">
                                            <label>Số lượt xem</label>
                                            <input name="number_view_leads" type="text" min="10" onkeydown="return false"
                                                   class="form-control touchspin-form-control-10" value="10"
                                                   id="number-view-leads">
                                        </div>

                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>Hình thức thanh toán</label>
                                    <div class="radio"><label><input type="radio" name="payment_type" value="0"
                                                                     checked="">Chuyển khoản ngân hàng</label></div>
                                    <div class="panel panel-default" id="payment-bank">
                                        <div class="panel-heading">Thông tin chuyển khoản</div>
                                        <div class="panel-body">
                                            + Số tài khoản: 0011004295197<br>
                                            + Chủ tài khoản: NGUYEN NAM PHONG <br>
                                            + Ngân hàng: TMCP Ngoại thương Việt Nam - Vietcombank<br>
                                            + Chi nhánh: Vietcombank chi nhánh Thanh Xuân<br>

                                        </div>
                                    </div>
                                    <div class="radio"><label><input type="radio" name="payment_type" value="1">Thanh
                                            toán trực tuyến qua VNPay</label></div>
                                </div>
                                <div class="row">
                                    <div class="col-xs-12">
                                        <button class="btn ht-btn-primary btn-block" type="button" id="payment-save">
                                            Thanh toán
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    <!-- CREDIT CARD FORM ENDS HERE -->


                </div>

                <div class="col-xs-12 col-md-4" style="line-height: 2em;">

                    <form class="register-form outer-top-xs" role="form" method="post" id="thanhtoan-form">

                    </form>

                </div>

            </div>

        </div>
    </div>
@endsection

@push('scripts')

    <script>
        $(document).on('change', '#package_id', function (e) {

            var number_rooms = $('option:selected', this).attr('data-number-rooms');
            $(".touchspin-form-control-10").val(number_rooms);

            $(".touchspin-form-control-10").trigger("touchspin.updatesettings", {min: number_rooms});

            get_payment_info();

        });

        $(document).on('change', 'input[type=radio][name=payment_type]', function (e) {
            if ($(this).val() == 1) {
                $('#payment-bank').hide();
            } else {
                $('#payment-bank').show();
            }
        });

        $(document).on('change', '#month', function () {
            get_payment_info();

        });

        $(document).on('change', '#number-view-leads', function () {
            get_payment_info();

        });

        window.onload = function () {
            $(".touchspin-form-control-10").trigger("touchspin.updatesettings", {min: 10 });
            init();
        }

        $(document).ready(function () {
            get_payment_info();

        });

        function get_payment_info() {
            //var data_payment = $('#payment-form').serialize();
            $.ajax({
                url: '{{ url('get-payment-info-lead') }}',
                data: {
                    number_view_leads: $('#number-view-leads').val()
                },
                type: 'get',
                dataType: 'json',
                success: function (response) {
                    $('#thanhtoan-form').html(response.data);
                 //   get_voucher_info();
                }
            });
        }


        $(document).on('click', '#payment-save', function (e) {
            $.ajax({
                url: '{{ url('process-order-lead') }}',
                data: {
                    number_view_leads: $('#number-view-leads').val(),
                    payment_type: $('input[type=radio][name=payment_type]:checked').val(),
                },
                type: 'post',
                dataType: 'json',
                success: function (response) {
                    if (response.status == 1) {
                        if (response.url != '') {
                            window.location.href = response.url;
                        } else {
                            swal('Thành công', 'Đơn hàng của bạn đã được lưu lại và chờ xử lý. Cám ơn bạn đã sử dụng dịch vụ của iTro.vn', 'success');
                            setTimeout(function () {
                                location.reload();
                            }, 3500);
                        }
                    } else {
                        swal('Thông báo', response.message, 'info');
                    }

                }
            });
        });
    </script>


@endpush