@extends('layout.master')
@section('content')
    <section class="content pb-5">
        <div class="container-fluid">

            <meta name="csrf-token" content="{!! csrf_token() !!}">

            <div class="row pt-4">
                <div class="col-md-12">
                    <div class="title-section">
                        <p>Settings</span></p>
                    </div>
                </div>

                <div class="col-md-12 pt-0 pt-sm-4">
                    <div class="title-section">
                        <p>Label, Invoice & POD <span>Label Preferences</span></p>
                    </div>
                </div>
            </div>

            <div class="row pt-0 pt-sm-4">
                <div class="col-md-12">
                    <div class="zone-box">
                        <h5 class="heading mb-3">Bank Account Details</h5>
                        <p>As a verification process, we will make a transaction of Rs. 1.0 to your bank account. Your account gets verified when the amount is credited successfully in your bank account.</p>
                        <p style="font-weight:bold;">Note: Account holder's name should be the same as the name mentioned in the KYC document</p>
                        <div class="seller-remit">
                            <div class="row">

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label d-flex justify-content-between" for="customer">IFSC Code<span class="text-danger">*</span><span class="">
                                            <input class="form-control" id="ifsc_code" type="text" value="{{ isset($data->ifsc_code) ? $data->ifsc_code : ''}}" oninput="ifcCodeFetchData(this)"> 
                                            <span style="display: none; background-color: red;" id="ifsc_code_error">Invalid IFSC</span>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Account holder's name <span class="text-danger">*</span></label>
                                        <input class="form-control" id="holder_name" type="text" value="{{ isset($data->account_holder) ? $data->account_holder : ''}}">
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Account Type <span class="text-danger">*</span></label>
                                        <select class="form-control" id="account_type">
                                            <option value="Select Account Type">Select Account Type</option>
                                            <option value="current_account" @if( (isset($data->account_type) ? $data->account_type : '') == 'current') selected @endif>Current Account</option>
                                            <option value="saving_account" @if( (isset($data->account_type) ? $data->account_type : '') == 'savings') selected @endif>Saving Account</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Account No. <span class="text-danger">*</span></label>
                                        <input class="form-control" id="account_no" type="text" id="account_no" value="{{ isset($data->account_number) ? $data->account_number : ''}}"> 
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Re-Enter Account No. <span class="text-danger">*</span></label>
                                        <input class="form-control" id="re_enter_account_no" type="text" value=""> 
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Bank Name</label>
                                        <input class="form-control" id="bank_name" type="text" value="{{ isset($data->bank_name) ? $data->bank_name : ''}}"> 
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="customer">Branch Name</label>
                                        <input class="form-control" id="branch_name" type="text" value="{{ isset($data->branch_name) ? $data->branch_name : ''}}"> 
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="mt-3 mt-sm-4">
                            <button type="button" class="btn btn-danger" onclick="saveBankDeatisl()">Save Bank Details</button>
                        </div>
                    </div>
                </div>      
            </div>
        </div>

        <!-- modal  -->

        <div class="modal fade" id="ifsc-code" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title mb-0" id="exampleModalLabel">
                            <div class="title-section">
                                <p>Branch IFSC Lookup</p>
                            </div>
                        </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true"><img src="images/close.png" height="30px" alt=""></span>
                        </button>
                    </div>

                    <div class="modal-body">
            
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group custom-form-group">
                                    <label class="form-label" for="customer">Bank Name</label>
                                    <input class="form-control" placeholder="Retail" id="bank_name" type="text" value=""> 
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group custom-form-group">
                                    <label class="form-label" for="customer">Branch Name</label>
                                    <input class="form-control" placeholder="Retail" id="branch_name" type="text" value=""> 
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group custom-form-group">
                                    <label class="form-label" for="customer">IFSC CODE</label>
                                    <input class="form-control" placeholder="Retail" id="ifsc_code" type="text" value=""> 
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div class="">
                            <button type="button" class="btn btn-danger save-btn" onclick="addIfsc()">Add IFSC</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <script type="text/javascript">

        function ifcCodeFetchData(e) {

            var test = /^[A-Z]{4}0[A-Z0-9]{6}$/;
            var value = e.value;
            if (value.match(test)) { 
                $('#ifsc_code_error').hide();
                jQuery.ajax({
                    url: "{{route('fetching-ifsc-code')}}",
                    type: "POST",
                    data: { _token: "{{csrf_token()}}", ifsc_code: value },
                    success: function(data) {
                        console.log(data);
                       $('#bank_name').val(data.data.bank_name);
                       $('#branch_name').val(data.data.branch_name);
                    }
                });

                return;

            }else {

                $('#ifsc_code_error').show();
                return;

            }
        }

        function saveBankDeatisl() {

            var holderName = $('#holder_name').val();
            var accountType = $('#account_type').val();
            var accountNumber = $('#account_no').val();
            var ifseCode = $('#ifsc_code').val();
            var reAccountNumber = $('#re_enter_account_no').val();
            var bankName = $('#bank_name').val();
            var branchName = $('#branch_name').val();

            var data = {
                '_token': "{{csrf_token()}}",
                'holderName':holderName,
                'accountType':accountType,
                'accountNumber':accountNumber,
                'ifseCode':ifseCode,
                'bankName':bankName,
                'branchName':branchName,
            }
            
            $.ajax({
                url : "{{route('update/bank/details')}}",
                type: 'POST',
                data: data,
                success:function(data) {       
                    swal({
                        icon: 'success',
                        title: "Updated",
                        text: 'Bank Deatils has been updated!.',
                        type: "success",

                        closeOnConfirm: false,
                        showLoaderOnConfirm: true,
                    });

                    window.location.href = '{{url("/settings")}}';
                }
            });
        }

    </script>
@endsection