@extends('layouts.app')

@section('css')
    <link href="{{ asset('plugins/jquery-datatable/skin/bootstrap/css/dataTables.bootstrap.css') }}" rel="stylesheet">
    <link href="{{ asset('css/responsive.dataTables.min.css') }}" rel="stylesheet">
    <link href="{{ asset('plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endsection

@section('contenido')

<div class="container-fluid">
    <div class="row clearfix">
        <div class="card">
            <div class="header">
            <div class="user-info">
        <div class="image">
            <img src="{{ asset('img/logo.png') }}" width="250" height="100" alt="Logo" />
        </div>
    </div>
    <P></P>
                <div class="row clearfix">
                    <div class="col-xs-8 col-sm-8 col-md-8">
                        <h1>
                            Orden de Compra {{$orden->folio}}
                        </h1>
                    </div>
                    <div class="col-xs-2">
                        <h1>
                            <button class="btn btn-primary waves-effect" onclick="Imprimir();">Imprimir</button>
                        </h1>
                    </div>
                    <div class="col-xs-2">
                        @if($orden->estado == \App\Models\Documento::ORDEN_PENDIENTE)
                        <h1>
                            <form action="{{route('ordenes_compra.enviar')}}" method="POST">
                                @csrf
                                <input type="hidden" name="id" value="{{$orden->id}}">
                                <button type="submit" class="btn btn-primary waves-effect">Enviar</button>
                            </form>
                        </h1>
                        @endif
                    </div>
                </div>
                <div class="body">
                    <div class="row">
                            <div class="col-md-8">
                                <div class="col-md-12">
                                    <table id="dataTable" class="table  dataTable js-exportable">
                                        <thead>
                                            <tr>
                                                <th>Codigo</th>
                                                <th>Producto</th>
                                                <th>Cantidad</th>
                                                <th>Precio</th>
                                                <th>Subtotal</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($orden->detalle as $detalle)
                                            <tr>
                                                <td>{{$detalle->producto->codigo}}</td>
                                                <td>{{$detalle->producto->nombre}}</td>
                                                <td>{{$detalle->cantidad}}</td>
                                                <td>{{$detalle->precio}}</td>
                                                <td>{{$detalle->precio*$detalle->cantidad}}</td>
                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="card">
                                    <div class="body">
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="form-group m-bottom-0">
                                                    <div class="form-line ">
                                                        <b>Subtotal</b>
                                                        <input type="text" class="form-control" name="subtotal" id="subtotal" readonly="true" value="{{$orden->subtotal}}">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="form-group m-bottom-0">
                                                    <div class="form-line ">
                                                        <b>Descuento</b>
                                                        <input type="text" class="form-control" name="descuento" id="descuento" readonly="true" value="{{$orden->descuento}}">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="form-group m-bottom-0">
                                                    <div class="form-line ">
                                                        <b>Neto</b>
                                                        <input type="text" class="form-control" name="neto" id="neto" readonly="true" value="{{$orden->neto}}">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="form-group m-bottom-0">
                                                    <div class="form-line ">
                                                        <b>IVA</b>
                                                        <input type="text" class="form-control" name="iva" id="iva" readonly="true" value="{{$orden->iva}}">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="form-group m-bottom-0">
                                                    <div class="form-line ">
                                                        <b>Total</b>
                                                        <input type="text" class="form-control" name="total" id="total" readonly="true" value="{{$orden->total}}">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




@endsection

@section('scripts')
    <script src="{{ asset('plugins/jquery-datatable/jquery.dataTables.js') }}"></script>
    <script src="{{ asset('js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ asset('plugins/jquery-datatable/skin/bootstrap/js/dataTables.bootstrap.js') }}"></script>
    <script src="{{ asset('plugins/jquery-datatable/extensions/export/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
    <script src="{{ asset('plugins/select2/select2.min.js') }}"></script>
    <script src="{{ asset('plugins/select2/es.js') }}"></script>
    <script src="{{ asset('js/jquery.number.min.js') }}"></script>
    <script src="{{ asset('js/script.js') }}"></script>
    <script>


    var table = $('#dataTable').DataTable({
        paging: false,
        searching: false,
        ordering: false,
        info: false,
    });

    function Imprimir() {

        window.location.href = "{{route('ordenes_compra.imprimir', $orden->id)}}";
        }


</script>

@endsection