@extends('layouts.app')

@section('title', 'Statistiche')

@section('content')
<style>
    
    .table-hover > tbody > tr:hover {
        background-color: #1ab394!important;
        color: #ffffff!important;
    }

   .bulb {
        height: 7rem;
        width: 7rem;
        background-color: #e8e8e8;
        border-radius: 50%;
        margin: 25px auto;
        transition: background 500ms;
        border: 3px solid #cccccc;
    }

</style>

<div class="row wrapper border-bottom white-bg page-heading">
    <h1>Iban Check</h1>
    <ol class="breadcrumb">
        <li>
            <a href="/">Home</a>
        </li>
        <li>
            <a>Finanze</a>
        </li>
        
        <li class="active">
            <a href=''>Iban Check</a>
        </li>

    </ol>
</div>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="ibox-content m-b-sm border-bottom">
            <div class="text-center" style="padding-bottom: 13px;
                                    border-bottom: 3px solid #1ab394;
                                    
                                    margin-top: 6px;">
                <h2 class="faq-question">Servizi di integrazione sul credito &nbsp;<img  src="http://d9hhrg4mnvzow.cloudfront.net/lp.buydirect.cerved.com/report-aziende/ddc03ba1-logo-cerveddirect.png"></img></h2>
                <span style="color: red;">(servizio a pagamento)</span>
            </div>
        
            <div class="container-fluid">
                <div class="row" style="margin: 10px;">
                    <div class="col-md-8">
                        <div style="padding: 20px">
                            <form action="#" method="POST">
                                @csrf

                                <select class="form-control" id="iban_type" name="iban_type">
                                    <option value="PERSON" selected="selected">PERSONA</option>
                                    <option value="COMPANY">COMPAGNIA</option>
                                </select>
                                <br><br>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group"><label>Iban</label> <input type="text" id="iban" name="iban" placeholder="Inserisci iban..."  value="" class="form-control"></div>   
                                    </div>

                                    <div class="col-md-6">
                                        <div class="form-group"><label>P. Iva oppure Codice Fiscale</label><input type="text" id="tax_code" name="tax_code" placeholder="Inserisci P.iva o cf..."  value="" class="form-control"></div>   
                                    </div>
                                </div>

                                <div class="row m-md text-center">
                                    <button id="ibanCheckButton" type="button" onclick="checkIbanResponse()" class="btn btn-primary btn-lg">Interroga</button>
                                </div>
                            </form>
                        </div>
                    </div>

                    <div class="col-md-4">
                        <div class="row">
                            <div class="col">
                                <div id="green" class="bulb"></div>
                                <h2 class="text-center" id="esitoCheck"></h2>
                                <h3 class="text-center" id="bank_info"></h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
function checkIbanResponse() {
    var formData = {
      iban: $("#iban").val(),
      tax_code: $("#tax_code").val(),
      iban_type: $("#iban_type").val(),
    };

    $("#green").css('background', '#e8e8e8');
    $('#ibanCheckButton'). prop('disabled', true);
    $("#esitoCheck").text('');
    $("#bank_info").text('');
    $.ajax({
      type: "POST",
      url: "/finanze/ibancontrol",
      data: formData,
      dataType: "json",
      encode: true,
    }).done(function (data) {
        $('#ibanCheckButton'). prop('disabled', false);
        if (typeof data.errore  !== 'undefined') {
            $("#esitoCheck").text(data.errore);
            //alert(data.errore);
            $("#green").css('background', 'red');
        } else if (data.validation_status == true) {
            $("#green").css('background', 'green');
            $("#esitoCheck").text('IBAN ASSOCIATO A CF/P.IVA');
            // dati banca
            let info = data.bank_info.business_name + " " + data.bank_info.branch_name + " " + data.bank_info.city;
            $("#bank_info").text(info);
        } else if (data.validation_status == false) {
            $("#green").css('background', 'red');
            $("#esitoCheck").text('IBAN NON ASSOCIATO A CF/P.IVA');
        };
      });

    event.preventDefault();
};

</script>
@endsection