@extends('layouts.master')

@section('content')

<style>

</style>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">{{ trans('defaultSettings.Net Banking and Wallet settings') }}</h1>
                </div>
                <!-- /.col -->
                <div class="col-sm-3"></div>
                <div class="col-sm-3">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item">{{ Breadcrumbs::render('Net Banking and Wallet Settings') }}</li>
                    </ol>
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->
    <section class="content">
        <div class="card" id="filterDiv">
            <div class="card-header">
                <!-- <form id="onboarding-form">-->
                {!! Form::open(array("enctype"=>"multipart/form-data","id"=>"payment-form")) !!}
                <!-- <h3 class="card-title">{{ trans('defaultSettings.Onboarding Settings') }}</h3>  -->
                <div class="card-primary card-form-1">
                    <div class="card-body">
                        @csrf

                        <div class="form-col-1">
                            {{ Form::label('Select Payment Gateway', trans('defaultSettings.Paymentgateway'), ['class' => 'required'])}}
                            {{ Form::select('payment_gatway',$payment_provide,'',['class' => 'form-control select2gateway','placeholder' => trans('reports.Select option'), 'id' => 'payment_mode']) }}
                            <span id="payment_gatway-error" class="error-help-block"></span>
                        </div>

                        <div class="form-col-1" id="paymodeshow">
                            {{ Form::label('Select Payment Mode', trans('defaultSettings.Paymentmode'), ['class' => 'required'])}}
                            {{ Form::select('payment_mode',$payment_mode,'',['class' => 'form-control select2paymentmode','placeholder' => trans('reports.Select option'), 'id' => 'payment_mode']) }}
                            <span id="payment_mode-error" class="error-help-block"></span>
                        </div>

                        <div class="form-col-3" id="checks_box">

                        </div>


                    </div>
                </div>
                <!-- </form>-->
                {!! Form::close() !!}
                <div class="card-primary card-form-1">
                    <div class="card-body">
                        <div class="button_sec" id="form-buttons">
                            <!--  <button class="btn btn-primary" id="payment-form-submit">{{ trans('layout.Submit') }}</button>
                                <button class="btn btn-default" id="payment-form-form-clear">{{ trans('layout.Clear') }}</button>-->
                        </div>
                        <div class="button_sec" id="form-loader" style="display:none">
                            <img style="height: 65px;width: 65px;" src="{{ asset('img/lg.double-ring-spinner.gif') }}">
                        </div>
                    </div>
                </div>
                <div class="card-primary card-form-1">
                    <div class="card-body">
                        <div class="button_sec" id="form-buttons">
                            <button class="btn btn-primary" id="payment-new-bank">Add New Bank</button>
                            <button class="btn btn-primary" id="payment-cancel-new-bank">Cancel</button>
                        </div>
                    </div>
                </div>
                <div id="show-bank-form" style="display:none;">
                    <div id="showsuccess"></div>
                    {!! Form::open(array('name'=>'bank_details','id'=>'bank_details')) !!}
                    <div class="row" id="main_bank">
                        <div class="form-col-1">
                            {{ Form::label('Select Payment Gateway', trans('defaultSettings.Paymentgateway'), ['class' => 'required'])}}
                            {{ Form::select('payment_gatway',$payment_provide,'',['class' => 'form-control select2','placeholder' => trans('reports.Select option'), 'id' => 'payment_mode']) }}
                            <span id="payment_gatway_bank-error" class="error-help-block"></span>
                        </div>
                        <div class="form-col-1">
                            {{ Form::label('bankname','Bank Name', ['class' => 'required'])}}
                            {{ Form::text('bankname','', ['id' => 'bankname', 'class' => 'form-control bankname']) }}
                            <span id="bank_name-error" class="error-help-block"></span>
                        </div>

                        <div class="form-col-1">
                            {{ Form::label('bankcode','Bank Code', ['class' => 'required'])}}
                            {{ Form::text('bankcode','', ['id' => 'bankcode', 'class' => 'form-control bankcode']) }}
                            <span id="bank_code-error" class="error-help-block"></span>
                        </div>

                        <div class="form-col-1">
                            {{ Form::label('bankimage','Bank Image', ['class' => 'required'])}}
                            {{ Form::file('bankimage', ['id' => 'bankimage', 'class' => 'form-control bankimage']) }}
                            <span id="bank_image-error" class="error-help-block"></span>
                        </div>



                        <div id="addmorefields">

                        </div>

                        <div class="button_sec" id="form-buttons">
                            <!-- <button class="btn btn-primary" id="addmore">Add More</button>-->
                            <button class="btn btn-primary" id="bank-form-submit">{{ trans('layout.Submit') }}</button>
                            <button class="btn btn-default" id="bank-form-form-clear">{{ trans('layout.Clear') }}</button>
                        </div>

                        {!! Form::close() !!}
                    </div>


                </div>
            </div>

        </div>
        <!-- /.card-body -->
</div>
</section>
</div>
@endsection
@section('javascript')
<script type="text/javascript">
    $(document).ready(function() {
        $('#bank-form-form-clear').click(function(e) {
            e.preventDefault();
            $('.error-help-block').text('');
            $('#bank_details').each(function() {
                this.reset();
            });
        });
        $('.select2paymentmode').on('change', function() {
            var data = $(this).find("option:selected").val();
            var data_gateway = $('.select2gateway').find("option:selected").val();
            if (data_gateway != "" && data !== "") {
                (data == 4) ? bankdetailscheck(data, data_gateway): walletdetailscheck(data, data_gateway);
            } else {
                $('.select2paymentmode').find("option:selected").removeAttr('selected', 'selected');
                $('#payment_gatway-error').text('Please select Payment gateway and Payment mode').fadeOut(1500);
            }

        });

        $('.select2gateway').on('change', function() {
            var data = $('.select2paymentmode').find("option:selected").val();
            var data_gateway = $('.select2gateway').find("option:selected").val();

            if (data_gateway != "" && data !== "") {
                (data == 4) ? bankdetailscheck(data, data_gateway): walletdetailscheck(data, data_gateway);
            } else {
                $('.select2paymentmode').find("option:selected").removeAttr('selected', 'selected');
                $('#payment_gatway-error').text('Please select Payment gateway and Payment mode').fadeOut(1500);
            }

        });

        function bankdetailscheck(data, data_gateway) {
            $.ajax({
                type: "POST",
                url: "{{ route('netbankingAndWalletsettings.getBankDetails') }}",
                data: {
                    "gatway_id": data_gateway,
                    "mode_id": data,
                    "_token": "{{ csrf_token() }}",
                },
                success: function(response) {
                    var checks = "";
                    var obj = JSON.parse(response);
                    $.each(obj, function(index, value) {
                        if (value.STATUS == 1) {
                            checks += "<input type='checkbox' class='checkboxtogg' value='" + value.BANK_ID + "' checked>" + value.BANK_NAME;
                        } else {
                            checks += "<input type='checkbox' class='checkboxtogg' value='" + value.BANK_ID + "'>" + value.BANK_NAME;
                        }
                    });
                    $('#checks_box').html(checks + '<br> <span id="status_changed_msg" class="error-help-block"></span>');

                    $('#checks_box .checkboxtogg').on('change', function() {
                        var check_id = $(this).val();
                        var checks_check = "";
                        if (!$(this).is(":checked")) {
                            checks_check = 0;
                            $(this).removeAttr('checked');
                        } else {
                            checks_check = 1;
                            $(this).attr('checked', 'checked');
                        }
                        $.ajax({
                            type: "POST",
                            url: "{{ route('netbankingAndWalletsettings.statusChange') }}",
                            data: {
                                "mode": $('.select2paymentmode').find("option:selected").val(), //Here Netbanking and Wallet only taken with id like Netbanking - 4 and Wallet - 2 for the future you can add the ids for more
                                "checks_check": checks_check,
                                "check_id": check_id,
                                "_token": "{{ csrf_token() }}",
                            },
                            success: function(response) {
                                (response == 1) ? $('#status_changed_msg').text('Status has  changed').fadeOut(1500): $('#status_changed_msg').text('Status has not changed').fadeOut(1500);
                            }
                        });
                    });
                }
            });

        }

        function walletdetailscheck(data, data_gateway) {

            $.ajax({
                type: "POST",
                url: "{{ route('netbankingAndWalletsettings.getBankDetails') }}",
                data: {
                    "gatway_id": data_gateway,
                    "mode_id": data,
                    "_token": "{{ csrf_token() }}",
                },
                success: function(response) {
                    var checks = "";
                    var obj = JSON.parse(response);
                    $.each(obj, function(index, value) {
                        if (value.STATUS == 1) {
                            checks += "<input type='checkbox' class='checkboxtogg' value='" + value.WALLET_ID + "' checked>" + value.WALLET_NAME;
                        } else {
                            checks += "<input type='checkbox' class='checkboxtogg' value='" + value.WALLET_ID + "'>" + value.WALLET_NAME;
                        }
                    });
                    $('#checks_box').html(checks + '<br> <span id="status_changed_msg" class="error-help-block"></span>');

                    $('#checks_box .checkboxtogg').on('change', function() {
                        var check_id = $(this).val();
                        var checks_check = "";
                        if (!$(this).is(":checked")) {
                            checks_check = 0;
                            $(this).removeAttr('checked');
                        } else {
                            checks_check = 1;
                            $(this).attr('checked', 'checked');
                        }
                        $.ajax({
                            type: "POST",
                            url: "{{ route('netbankingAndWalletsettings.statusChange') }}",
                            data: {
                                "mode": $('.select2paymentmode').find("option:selected").val(), //Here Netbanking and Wallet only taken with id like Netbanking - 4 and Wallet - 2 for the future you can add the ids for more
                                "checks_check": checks_check,
                                "check_id": check_id,
                                "_token": "{{ csrf_token() }}",
                            },
                            success: function(response) {
                                (response == 1) ? $('#status_changed_msg').text('Status has  changed').fadeOut(1500): $('#status_changed_msg').text('Status has not changed').fadeOut(1500);
                            }
                        });
                    });
                }
            });

        }

        $('#payment-new-bank').click(function() {
            $('#show-bank-form').slideDown(1500).show();
        });

        $('#payment-cancel-new-bank').click(function() {
            $('#show-bank-form').slideUp('slow');
        });

        $('#addmore').click(function() {
            $('#main_bank').clone().find("input:text,input:file").val("").end().appendTo("#addmorefields");
        });

        $('#bank-form-submit').click(function(event) {
            event.preventDefault();
            var formData = new FormData($('#bank_details')[0]);
            $.ajax({
                url: "{{ route('netbankingAndWalletsettings.createBankDetails') }}",
                type: 'POST',
                data: formData,
                processData: false,
                contentType: false,
                success: function(response) {
                    var stringified = JSON.stringify(response);
                    var obj = JSON.parse(stringified);
                    if (obj.success == false) {
                        if (obj.errors.bankcode != "" && typeof(obj.errors.bankcode) != 'undefined') {
                            $('#bank_code-error').text(obj.errors.bankcode);
                        } else {
                            $('#bank_code-error').text('');
                        }
                        if (obj.errors.bankname != "" && typeof(obj.errors.bankname) != 'undefined') {
                            $('#bank_name-error').text(obj.errors.bankname);
                        } else {
                            $('#bank_name-error').text('');
                        }
                        if (obj.errors.payment_gatway != "" && typeof(obj.errors.payment_gatway) != 'undefined') {
                            $('#payment_gatway_bank-error').text(obj.errors.payment_gatway);
                        } else {
                            $('#payment_gatway_bank-error').text('');
                        }
                        if (obj.errors.bankimage != "" && typeof(obj.errors.bankimage) != 'undefined') {
                            $('#bank_image-error').text(obj.errors.bankimage);
                        } else {
                            $('#bank_image-error').text('');
                        }
                    } else {
                        swal('Bank Details updated successfully', {
                            icon: "success",
                        });
                        setTimeout(function() {
                            $('#showsuccess').html('');
                            $('#show-bank-form').slideUp('slow');
                            $('#bank_details').each(function() {
                                this.reset();
                            });
                        }, 3000);
                    }
                },
                error: function(data) {
                    console.log(data);
                }
            });

        });

    });
</script>
@stop