@extends("app")
@section("content")
<div class="container">
    <div class="row">
        <div class="col-md-6">
            <h1 class="dashboard-heading">
                Divisas/ Datos
            </h1>
            <h2 class="dashboard-heading">
                Zurich Santander
            </h2>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            {!! Form::open(['route' => 'detalle.store']) !!}
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        {!! Form::label('date', 'Fecha:', ['class' => 'control-label']) !!}
                        {!! Form::date('date', Carbon\Carbon::today()->format('Y-m-d'), ['class' => 'form-control', 'required' => 'required', 'autofocus' => 'autofocus']) !!}
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                       {!! Form::label('type_transaction', 'Tipo de Transacción:', ['class' => 'control-label']) !!}
                       <select class="form-control" id="sel" name="foreign_exchange_type">
                        <option>Ingresos</option>
                        <option>Egresos</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <!-- Nav tabs --><div class="card">
                    <ul class="nav nav-tabs" role="tablist">
                        <li role="presentation" class="active"><a href="#dolar" aria-controls="dolar" role="tab" data-toggle="tab">Dolares</a></li>
                        <li role="presentation"><a href="#euros" aria-controls="profile" role="tab" data-toggle="tab">Euros</a></li>
                    </ul>
                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="dolar">
                            <div class="content-banks">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">Santander 5375</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_santander', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander][mount]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_santander', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_santander', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander][total]" class="clevar form-control montos" readonly="true" >
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_santander', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[santander][concept]" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">Santander 7067</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_santander', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander2][mount]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_santander', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander2][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_santander', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[santander2][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_santander', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[santander2][concept]" class="form-control">
                                        </div>
                                    </div>

                                </div>
                            </div> 
                            <div class="content-banks">
                                <div class="row">

                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">Banorte</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_banorte', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[banorte][mount]" class="clevar form-control js-calculated montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_banorte', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[banorte][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_banorte', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[banorte][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_banorte', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[banorte][concept]" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">MONEX</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_monex', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex][mount]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_monex', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_monex', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_monex', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[monex][concept]" class="form-control">
                                        </div>
                                    </div>
                                </div>
                            </div>  
                            <div class="content-banks">
                                <div class="row">


                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">INTERCAM</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_intercam', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam][mount]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_intercam', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_intercam', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_intercam', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[intercam][concept]" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">Vector</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_intercam', 'Monto Dólares:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[vector][mount]" class="clevar form-control js-calculated montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_intercam', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[vector][exchange_rate]" class="clevar form-control montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_intercam', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[vector][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_intercam', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[vector][concept]" class="form-control">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="euros">
                            <div class="content-banks15">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">MONEX</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_monex_euros', 'Monto Euros:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex_eu][mount]" class="clevar form-control js-calculated montos qty1">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_monex_euros', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex_eu][exchange_rate]" class="clevar form-control qty1 montos">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_monex_euros', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[monex_eu][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_monex_euros', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[monex_eu][concept]" class="form-control">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <h2 class="dashboard-heading">INTERCAM</h2>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('mount_intercam_euros', 'Monto Euros:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam_eu][mount]" class="clevar form-control js-calculated qty1 montos">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('exchange_rate_intercam_euros', 'Tipo Cambio MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam_eu][exchange_rate]" class="clevar form-control qty1 montos">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('total_intercam_euros', 'Total en MXN:')!!}
                                            <div class="input-group">
                                                <div class="input-group-addon">$</div>
                                                <input type="text" name="foreign_exchange[intercam_eu][total]" class="clevar form-control montos" readonly="true">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            {!! Form::label('concept_intercam_euros', 'Concepto:')!!}
                                            <input type="text" name="foreign_exchange[intercam_eu][concept]" class="form-control">
                                        </div>
                                    </div> 
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-2 col-md-2 pull-right">
                                <button type="submit" class="btn btn-primary btn-block">
                                    Enviar
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

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

@endsection

@section('script')

<script type="text/javascript">
    $('.clevar').each(function (i, v) {
        new Cleave(v, {
            numeral: true,
            numeralThousandsGroupStyle: 'thousand'
        });
    });
</script>
<script> 
    $('.qty1').keyup(function(){

        let $contenedor_divisa = $(this).closest('.col-md-6');
        let $total = $contenedor_divisa.find("[name*='total']");
        // console.log($contenedor_divisa);
        let $campos = $contenedor_divisa.find(".qty1");
        let _total = 1;

        $campos.each(function(i,v){
            _total = _total * parseFloat($(v).val().replace(',',''));
        }); 
        $total.val(isNaN(_total) ? '' : _total);

    });
</script>
<script>
    $(document).ready(function(){ //by using input class
      $(".montos").each(function(){
            $(this).val("0.00");
       })
})
</script>

@endsection