@extends('layouts.dashboard')
@section('css')
    <link href="{{ asset('css/receptores/create.css') }}" rel="stylesheet">
@endsection

@section('js')
    <script src="{{ asset('js/timbres/main.js') }}"></script>
@endsection

@section('content')

    <div class="app-page-title d-xs-none">
        <div class="page-title-wrapper">
            <div class="col-sm-4">
                <div class="page-title-heading">
                    <div>
                        <div class="page-title-subheading">
                           
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-sm-8">
                <div class="page-header float-right">
                    <nav class="" aria-label=" breadcrumb">
                        <ol class="breadcrumb text-right">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Inicio</a></li>
                            <li class="active breadcrumb-item" aria-current="page"><a
                                    href="{{ route('timbres.index') }}">Timbres</a></li>
                            <li class="active breadcrumb-item" aria-current="page">Compra de timbres</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>

    @if (session('message'))
        <div class="alert alert-success alert-dismissable col-4"
            style="text-align: center;margin: auto;margin-bottom: 1rem;">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <strong>{{ session('message') }}</strong>
        </div>
    @endif

    @if ($errors->any())
        <div class="alert alert-danger alert-dismissable col-4"
            style="text-align: center;margin: auto;margin-bottom: 1rem;">
            <button type="button" class="close" data-dismiss="alert">&times;</button>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>
                        <strong>{{ $error }}</strong>
                    </li>
                @endforeach
            </ul>
        </div>
    @endif

    <script>
    c_timbres = new Array();
    timbre_ini = 0;
    timbre_fin = 0;
    @php
        $cont = 0;
    @endphp
    @foreach ($timbres as $timbre)
        @if($cont == 0)
            @php
                $timbre_ini = $timbre->timbre_ini;
            @endphp
            timbre_ini = {{ $timbre->timbre_ini }};
        @endif
            c_timbres.push({
                "id_timbre": "{{ $timbre->id_timbre }}",
                "precio": {{ $timbre->precio }},
                "timbre_ini": {{ $timbre->timbre_ini }},
                "timbre_fin": {{ $timbre->timbre_fin }},
            });
        @php
            $cont++;
        @endphp     
        timbre_fin = {{ $timbre->timbre_fin }};                                
    @endforeach
    </script>

    <div class="animated fadeIn d-flex justify-content-center mt-5">
        <form action="{{ route('ordenes.create') }}" method="GET" class="col-lg-6 col-md-12" autocomplete="off">
            @csrf

            <div class="card">
                <div class="card-header">Compra de timbres</div>
                <div class="card-body card-block">

                    <div class="row form-group">
                        <div class="col col-md-3">
                            <label for="txt_nombre" class=" form-control-label">Cantidad de timbres
                            </label><span class="color-red " style="color: red;">*</span>
                        </div>

                        <div class="col-12 col-md-9">
                            <input type="text" id="txt_no_timbres" name="txt_no_timbres" placeholder="La cantidad deberá ser igual o mayor a {{$timbre_ini}} timbres" class="form-control"
                                required="" value="{{ old('txt_no_timbres') }}" maxlength="9">
                                <input class="form-control input-mask-trigger" id="txt_numberformat"
                                        name="txt_numberformat" aria-label="number format" aria-describedby="numberformat"
                                        data-inputmask="'alias': 'numeric', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                        im-insert="true" style="text-align: right;display:none ;">
                        </div>
                    </div>

                    <table id="bootstrap-data-table" class="table table-striped table-bordered table_impuestos">
                                            <thead>
                                                <tr>
                                                    <th>Descripción</th>
                                                    <th style="text-align: right;">Importe</th>
                                                    
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>Precio unitario</td>
                                                    <td style="text-align: right;"><span id="lbl_precio_unitario">$00.00</span>
                                                    </td>
                                                    <input type="hidden" name="txt_precio_unitario" id="txt_precio_unitario">
                                                </tr>
                                                <tr>
                                                    <td>Cantidad de timbres</td>
                                                    <td style="text-align: right;"><span id="lbl_cant_timbres">0</span>
                                                    </td>
                                                    <input type="hidden" name="txt_cant_timbres" id="txt_cant_timbres">
                                                    <input type="hidden" name="txt_id_timbre" id="txt_id_timbre">
                                                </tr>
                                            <!--    <tr>
                                                    <td>Subtotal</td>
                                                    <td style="text-align: right;"><span id="lbl_subtotal">00.00</span>
                                                    </td>
                                                    <input type="hidden" name="txt_subtotal" id="txt_subtotal">
                                                </tr>
                                                <tr>
                                                    <td>I.V.A</td>
                                                    <td style="text-align: right;"><span id="lbl_iva">00.00</span>
                                                    </td>
                                                    <input type="hidden" name="txt_iva" id="txt_iva">
                                                </tr> -->
                                                <tr>
                                                    <th>Total</th>
                                                    <td style="text-align: right;"><span id="lbl_total">$00.00</span></td>
                                                    <input type="hidden" name="txt_total" id="txt_total">
                                                </tr>
                                            </tbody>
                                        </table>
                    
                    
       

                    

                </div>
            </div>

           
            

            <div class="col-auto mx-auto d-flex justify-content-center mb-2 pb-3">
                <div class="col-lg-4 col-md-4 d-flex justify-content-center">
                <button id="payment-button" type="button" class="btn btn-lg buttom_agregar" 
                onclick="timbres.valida()">
                    <span>Continuar compra</span>
                </button>
        
                </div>
                <div class="col-lg-4 col-md-4 d-flex justify-content-center">
                    <button id="cancel-button" type="button" class="btn btn-lg buttom_white"
                        onclick="window.location='{{ route('timbres.index') }}'">
                        <span>Cancelar</span>
                    </button>
                </div>
            </div>

        </form>
    </div>
    
@endsection