@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col  ">
            <div align="center">
                <img src="{{asset('assets/images/logo.jpg')}}" class="img-fluid rounded-circle mt-4" width="20%" height="350px" alt="">
                <p class="text-decoration-none"></p>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col mt-4">
            <h4 class="display-4 text-capitalize text-center"> Articulos Vendidos del mes: {{$mes}}, del año : {{$ano}} </h4>
        </div>
    </div>
    <div class="row my-4">
        <div class="col">
            <table class="table table-hover" id="deudas" data-page-length="15">
                <thead>
                    <tr>
                        <th>No. Factura</th>
                        <th>Articulo </th>
                        <th>Precio Venta</th>
                        <th>Precio Costo</th>
                        <th>Utilidad / Unitaria</th>
                        <th>Cantidad Vendida</th>
                        <th>Descuento</th>
                        <th>Total Con Descuento</th>
                        <th>Ganancia</th>
                        <th>Fecha / Hora de Venta</th>

                    </tr>
                </thead>
                <tbody>
                                        @foreach($ventas as $deu)
                                        <tr>
                        <td>{{$deu->factura_id}}</td>
                        <td>{{$deu->nomArt}} / {{$deu->descripcion}}</td>
                        <td>{{$deu->p_venta}}</td>
                        <td>{{$deu->p_costo}}</td>
                        <td>{{$deu->p_venta - $deu->p_costo}}</td>
                        <td>{{$deu->cantidad}}</td>
                        <td>
                                                        {{$deu->descuento}}
                        </td>


                        <td>{{($deu->p_venta ) * $deu->cantidad - ($deu->descuento)}}</td>

                        
                        <td>{{ (($deu->p_venta * $deu->cantidad ) - ($deu->p_costo * $deu->cantidad)) - $deu->descuento}} </td>

                        <td>{{$deu->fechaVenta}}</td>

                    </tr>
                    @endforeach
                </tbody>
            </table>

        </div>
    </div>

    <div class="row" style="text-align: right;">
        <div class="col">

            <h3 class="text-right text-info">
                <p>Total en Ventas (esperadas) :</p> Q. {{ $totalVentasS }}
                <p>Total en Ventas - Descuentos :</p> Q. {{ $totalVentasS -  $descuentos }}
                <p>Total en Descuentos :</p> Q. {{ $descuentos      }}
                <p>Ganancias :</p> Q. {{number_format($utilidad, 2)}}

            </h3>

        </div>
    </div>
    <hr>

    <button class="btn btn-info oculto-impresion" onclick="exportTableToExcel2('deudas', 'VENTA DE MEDICAMENTOS')">EXPORTAR TABLA</button>
</div>

@endsection


@section('scripts')
<script>
    function exportTableToExcel2(tableID, filename) {
        // Tipo de exportación
        if (!filename) filename = 'excel_data.xls';
        let dataType = 'application/vnd.ms-excel';

        // Origen de los datos
        let tableSelect = document.getElementById(tableID);
        let tableHTML = tableSelect.outerHTML;

        // Crea el archivo descargable
        let blob = new Blob([tableHTML], {
            type: dataType
        });

        // Crea un enlace de descarga en el navegador
        if (window.navigator && window.navigator.msSaveOrOpenBlob) { // Descargar para IExplorer
            window.navigator.msSaveOrOpenBlob(blob, filename);
        } else { // Descargar para Chrome, Firefox, etc.
            let a = document.createElement("a");
            document.body.appendChild(a);
            a.style = "display: none";
            let csvUrl = URL.createObjectURL(blob);
            a.href = csvUrl;
            a.download = filename;
            a.click();
            URL.revokeObjectURL(a.href)
            a.remove();
        }
    }
</script>
@endsection