@include('admin.layouts.header')
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
@include('admin.layouts.sidebar')
<style>
    .panel-heading {
        background-color: #f1f1f1;
        border: 1px solid #e0dfe0;
        padding-left: 10px;
        padding-top: 6px;
        cursor: pointer;
    }
</style>
<div class="m-grid__item m-grid__item--fluid m-wrapper">
    <!-- BEGIN: Subheader -->
    <div class="m-subheader ">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    {!! isset($merchant->bank_details->bank_name) ? 'Edit' : 'Add' !!} Merchant's Bank Details
                </h3>
                <ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
                    <li class="m-nav__item m-nav__item--home">
                        <a href="{{ asset('/') }}" class="m-nav__link m-nav__link--icon">
                            <i class="m-nav__link-icon la la-home"></i>
                        </a>
                    </li>
                    <li class="m-nav__separator">
                        -
                    </li>
                    <li class="m-nav__item">
                        <a href="{{ asset('admin-user') }}" class="m-nav__link">
                            <span class="m-nav__link-text">
                                 Bank Details
                            </span>
                        </a>
                    </li>
                    <li class="m-nav__separator">
                        -
                    </li>
                    <li class="m-nav__item">
                        <a href="" class="m-nav__link">
                            <span class="m-nav__link-text">
                                {!! isset($merchant->bank_details->bank_name) ? 'Edit' : 'Add' !!}
                            </span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- END: Subheader -->
    <div class="m-content">
        @if(Session::has('success'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
                {{ Session::get('success') }}
            </div>
        @endif
        @if(Session::has('error'))
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
                {{ Session::get('error') }}
            </div>
        @endif
        <div class="m-portlet m-portlet--mobile">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <span class="m-portlet__head-icon">
                            <i class="flaticon-add"></i>
                        </span>
                        <h3 class="m-portlet__head-text">
                            {!! isset($merchant->bank_details->bank_name) ? 'Edit' : 'Add' !!} Merchant's Bank Application

                            @if(isset($merchant->bank_details->karza_response) && $merchant->bank_details->karza_response == 'false')
                                <div style="padding: 5px;font-size: 12px;color: red;" id="b_vali_div"><i class="fa fa-exclamation-triangle" aria-hidden="true" style="margin-right: 6px;color: red;" title="Bank validation failed"></i>Bank validation failed !</div>
                            @elseif(isset($merchant->bank_details->karza_response))
                                <?php
                                $bank_validation = json_decode($merchant->bank_details->karza_response);
                                ?>
                                @if(!isset($bank_validation->result->bankResponse))
                                    <div style="padding: 5px;font-size: 12px;color: red;" id="b_vali_div"><i class="fa fa-exclamation-triangle" aria-hidden="true" style="margin-right: 6px;color: red;" title="Bank validation failed"></i>Bank validation failed !</div>
                                @else
                                    <div style="padding: 5px;font-size: 12px;color:@if(isset($bank_validation->result->bankTxnStatus) && $bank_validation->result->bankTxnStatus == false) red @else darkgreen @endif" id="b_vali_div">{!! $bank_validation->result->bankResponse or '' !!}</div>
                                @endif
                            @endif
                        </h3>
                    </div>
                </div>
            </div>
            <!--begin::Form-->
            <form action="{{ asset('admin/merchant/save-bank-details/'.$merchant_id) }}" class="m-form m-form--fit m-form--label-align-right" method="POST" enctype="multipart/form-data" id="save_bank_details" autocomplete="off">
                <div class="m-portlet__body">
                    <div class="m-form__section m-form__section--first">
                        <input type="hidden" name="merchant_id" value="{!! $merchant_id !!}"/>
                        <input type="hidden" name="_token" value="{{csrf_token()}}" />
                        <div class="form-group m-form__group row pan_fill_form">
                            <label class="col-lg-3 col-form-label">
                                Upload Cheque Copy
                            </label>
                            <div class="col-lg-4">
                                <input class="form-control" type="file" name="img_cheque_details"/>
                                <input class="form-control" type="hidden" name="img_cheque_details_type"/>
                            </div>
                            <div class="col-lg-2">
                                <div class="btn btn-success form-control fill-cheque-details">Fill Details <span class="loading_icon_c"><img src="/assets/front/img/loading.gif" style="position: absolute;margin-top: -25px;margin-left: 196px;display: none;padding-left: 17px;"></span></div>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Account Holder: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="account_holder" value="{{ Request::old('account_holder',isset($merchant->bank_details->account_holder) ? $merchant->bank_details->account_holder : '') }}" placeholder="Enter Account Holder Name" required="required"/>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Bank Name: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="bank_name" value="{{ Request::old('bank_name',isset($merchant->bank_details->bank_name) ? $merchant->bank_details->bank_name : '') }}" placeholder="Enter Bank Name" required="required"/>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Branch Name: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="branch_name" value="{{ Request::old('bank_name',isset($merchant->bank_details->branch_name) ? $merchant->bank_details->branch_name : '') }}" required="required" placeholder="Enter Branch Name"/>
                            </div>
                        </div>
                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Account Number: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="password" class="form-control m-input" name="account_number" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" value="{{ Request::old('account_number',isset($merchant->bank_details->account_number) ? $merchant->bank_details->account_number : '') }}" placeholder="Enter Account Number" required="required" id="account_number"/>
                            </div>
                        </div>

                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                Re-enter Account Number: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" placeholder="Enter Account Number" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" value="{{ Request::old('account_number',isset($merchant->bank_details->account_number) ? $merchant->bank_details->account_number : '') }}" required="required" id="re_enter_account" autocomplete="new-password"/>
                            </div>
                        </div>

                        <div class="form-group m-form__group row">
                            <label class="col-lg-3 col-form-label">
                                IFSC Code: <span style="color: red;">*</span>
                            </label>
                            <div class="col-lg-6">
                                <input type="text" class="form-control m-input" name="ifsc_code" oninput="validateIfsc()" value="{{ Request::old('ifsc_code',isset($merchant->bank_details->ifsc_code) ? $merchant->bank_details->ifsc_code : '') }}" placeholder="Enter IFSC Code" required="required" id="ifsc_code"/>
                                <span id="error_message_ifsc" style="color: red; display: none;font-size: 13px;">Please enter a valid IFSC Code.</span>
                            </div>
                        </div>
                        {{--isset($merchant->bank_details->karza_response) && $merchant->bank_details->karza_response == 'false' || !isset($bank_validation->result->bankResponse) || (isset($bank_validation->result->bankTxnStatus) && $bank_validation->result->bankTxnStatus == false)--}}
                        @if(true)
                            @if(\Illuminate\Support\Facades\Session::has('Merchant_Merchant_Bank_Validate|1-0-0-3'))
                            <div class="form-group m-form__group row">
                                <label class="col-lg-3 col-form-label">
                                    Re-Validate Bank:
                                </label>
                                <div class="col-lg-1">
                                    <input type="checkbox" style="margin-top: 5px;width: 32px;height: 20px;" class="form-control m-input" name="re_validate"/>
                                </div>
                            </div>
                           @endif
                        @endif
                    </div>
                </div>
                @if((!isset($merchant->bank_details->bank_name) && \Illuminate\Support\Facades\Session::has('Merchant_Merchant_Bank_Create|1-0-0-1')) || (isset($merchant->bank_details->bank_name) && \Illuminate\Support\Facades\Session::has('Merchant_Merchant_Bank_Update|1-0-0-2')))
                <div class="m-portlet__foot m-portlet__foot--fit">
                    <div class="m-form__actions m-form__actions">
                        <button type="submit" class="btn btn-primary">
                            {!! isset($merchant->bank_details->bank_name) ? 'Update' : 'Submit' !!}
                        </button>
                        <button type="reset" onclick="window.history.back()" class="btn btn-secondary">
                            Cancel
                        </button>
                    </div>
                </div>
                @endif
                <div class="m-form__actions m-form__actions">
                    <button href="{{ asset('admin/merchant/edit/'.$merchant->id) }}" class="btn btn-primary">
                        Go to Merchant edit
                    </button>
                </div>
            </form>
            <!--end::Form-->

            <div class="panel panel-default" style="padding: 15px;">
                <div class="panel-heading digital-esign">
                    <h4 class="panel-title" data-toggle="collapse" data-parent="#accordion" href="#collapse11">
                        <a style="font-size: 14px;">Merchant Bank Logs</a> <i class="la la-plus-circle" style="float: right;padding-right: 8px;padding-top: 5px;"></i>
                    </h4>
                </div>
                @if($merchantBankLogs)
                <div id="collapse11" class="panel-collapse collapse in">
                    <div class="panel-body">
                        <table class="table">
                            <tr>
                                <th>ID</th>
                                <th>Account Holder</th>
                                <th>Bank Name</th>
                                <th>Branch Name</th>
                                <th>Account Number</th>
                                <th>IFSC Code</th>
                                <th>Created At</th>
                                <th>Action By</th>
                            </tr>
                            <tbody>
                                @foreach($merchantBankLogs as $log)
                                    <tr>
                                        <td>{!! $log->id !!}</td>
                                        <td>{!! $log->account_holder !!}</td>
                                        <td>{!! $log->bank_name !!}</td>
                                        <td>{!! $log->branch_name !!}</td>
                                        <td>{!! $log->account_number !!}</td>
                                        <td>{!! $log->ifsc_code !!}</td>
                                        <td>{!! $log->created_at !!}</td>
                                        <td>{!! $log->user->name or '-' !!}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>
@include("admin.layouts.footer")


<script type="text/javascript">
    $('#account_number').bind("cut copy paste",function(e) {
        e.preventDefault();
    });

    $('#re_enter_account').bind("cut copy paste",function(e) {
        e.preventDefault();
    });

    function validateIfsc() {
            const inputField = document.getElementById('ifsc_code');
            const errorMessage = document.getElementById('error_message_ifsc');
            const regex = /^[A-Z]{4}0[A-Z0-9]{6}$/;

            if (!regex.test(inputField.value)) {
                inputField.classList.add('error');
                errorMessage.style.display = 'inline';
            } else {
                inputField.classList.remove('error');
                errorMessage.style.display = 'none';
            }
        }

    $("input[name='re_validate']").change(function(e) {
        if ($(this).prop('checked')){
            $("button[type='submit']").html('Update &amp; Re-Validate');
        }else{
            $("button[type='submit']").html('Update');
        }
    });

    $(".fill-cheque-details").click(function(){
        var event = this;
        var form = new FormData();
        $(this).find(".loading_icon_c > img").css({'display':'block'});
        var _token = '<?php echo csrf_token(); ?>';
        var merchant_id = "<?php echo $merchant_id ?>";
        var file = $("input[name='img_cheque_details']")[0].files[0];
        form.append("document", file, file.name);
        form.append('_token',_token);
        form.append('id',merchant_id);
        form.append('type','merchant');

        $.ajax({
            url: '/admin/consumer-application/get-cheque-details',
            type: 'POST',
            data: form,
            async: true,
            cache: false,
            contentType: false,
            processData: false,
            xhr: function() {
                var myXhr = $.ajaxSettings.xhr();
                if (myXhr.upload) {
                    myXhr.upload.addEventListener('progress', function(e) {
                        if (e.lengthComputable) {

                        }
                    } , false);
                }
                return myXhr;
            },
            complete : function(response) {

                let data = JSON.parse(response.responseText);
                if(typeof data.status !== 'undefined' && data.status !== 'FAIL'){
                    if($('input[name="branch_name"]').val() == '') {
                        $('input[name="branch_name"]').val(data.bank_details.branch);
                    }
                    if($('input[name="account_number"]').val() == '') {
                        $('input[name="account_number"]').val(data.acc_no);
                    }
                    if($('input[name="re_enter_account"]').val() == '') {
                        $('input[name="re_enter_account"]').val(data.acc_no);
                    }
                    if($('input[name="ifsc_code"]').val() == '') {
                        $('input[name="ifsc_code"]').val(data.ifsc);
                    }
                    if($('input[name="bank_name"]').val() == '') {
                        $('input[name="bank_name"]').val(data.bank);
                    }
                }else{
                    alert('Unable to read the document.');

                }
                $(event).find(".loading_icon_c > img").css({'display':'none'});
            }
        });
    });

    $("#save_bank_details").submit(function( event ) {
        const inputFieldAccountNumber = document.getElementById('account_number');
        const regexAccountNumber = /^[0-9]+$/;

        if (!regexAccountNumber.test(inputFieldAccountNumber.value)) {
            alert("Invlid Account Number");
            return false;
        }

        const inputFieldReAccountNumber = document.getElementById('re_enter_account');
        const regexReAccountNumber = /^[0-9]+$/;

        if (!regexReAccountNumber.test(inputFieldReAccountNumber.value)) {
            alert("Invlid Account Number");
            return false;
        }

        if($("#re_enter_account").length > 0) {
            if ($("#re_enter_account").val() !== $("#account_number").val()) {
                alert("Account number mismatch");
                return false;
            }
        }
        const inputFieldIfsc = document.getElementById('ifsc_code');
        const regexIfsc = /^[A-Z]{4}0[A-Z0-9]{6}$/;

        if (!regexIfsc.test(inputFieldIfsc.value)) {
            alert("Invlid IFSC Code");
            return false;
        }

        return true;
        event.preventDefault();
    });

    

    $(document).ready(function(){
        $("#workdiv").hide();
    })

    function selectBoxChanged(e){
        if(e.value == 'WORK'){
            $("#workdiv").show();
        }else{
            $("#workdiv").hide();
        }
    }
</script>