@extends('esencias.plantilla')
@section('contenido')
</div>
</div>
<div class="container-fluid" id="containerresultados">
    <div class="container">
        <div class="row py-3">
            <div class="col-md-12">
                <i class="fa fa-arrow-left" id="arrowleft" aria-hidden="true"></i> <a href="/index.php" id="linkvolver">volver a la b&uacute;squeda</a>
            </div>
        </div>
        <div class="row py-3" id="descripcionCuadro">
                @if(isset($array_producto_sistemafloral) && isset($array_tamanios))
                    <div class="col-md-5">
                        <img alt="" id="imagenDescripcion" src="esencias/images/{{$array_producto_sistemafloral->imagen }}" data-holder-rendered="true"><hr><br>
                        <strong>TIPO</strong>: <span style="color:rgb(216, 208, 208)">SISTEMA FLORAL</span><br>
                        <strong>TAMAÑO</strong>: <span style="color:rgb(216, 208, 208)"><br>@foreach($array_tamanios as $tamanio) {{$tamanio->tamanio}} <br> @endforeach</span><br>
                        <strong>S&Iacute;NTOMAS</strong>: <span style="color:rgb(216, 208, 208)">REPROCHE A UNO MISMO<br>CULPABILIDAD</span>
                    </div>
                    <div class="col-md-7" id="coldescripcion">
                        <h2>{{$array_producto_sistemafloral->nombre}}</h2><br>
                        <p>{{$array_producto_sistemafloral->descripcion}}</p><br><br><br>
                        <a href="#">LINK ART&Iacute;CULO PERIODISTICO</a><br><br>
                        BIBLIOGRAF&Iacute;A RELACIONADA<br>
                        <a href="#">LIBRO 1</a><br>
                        <a href="#">LIBRO 2</a><br><br><br>
                        <a type="button" id="buttonDescripcion" href="#" onclick="fAgregarAlCarrito({{ $array_producto->idproducto}})" class="btn">SUMAR A TU INFORME PERSONALIZADO</a>
                    </div>
                @endif
        </div>
        <div class="row py-2">
            <div class="col-md-12">
                <h2 id="resultados">Escencias que lo conforman</h2>
            </div>
        </div>
        <div class="row py-2 text-center" id="rowabecedario">
            <a href="#"> A </a> <a href="#"> B </a> <a href="#"> C </a> <a href="#"> D </a> <a href="#"> E </a> <a href="#"> F </a> <a href="#"> G </a> <a href="#"> H </a> <a href="#"> I </a> <a href="#"> J </a> <a href="#"> K </a> <a href="#"> L </a>
            <a href="#"> M </a> <a href="#"> N </a> <a href="#"> O </a> <a href="#"> P </a> <a href="#"> Q </a> <a href="#"> R </a> <a href="#"> S </a> <a href="#"> T </a> <a href="#"> U </a> <a href="#"> V </a> <a href="#"> W </a> <a href="#"> X </a>
            <a href="#"> Y </a> <a href="#"> Z </a>
        </div>
        <div class="row py-3">
            @if($array_productos_escencias_relacionado)
                @foreach($array_productos_escencias_relacionado as $escencias_relacionada)
                <div class="col-md-3 py-2">
                    <div class="card box-shadow">
                        <div class="card-header">
                            <img class="card-img-top" alt="" src="{{ asset('esencias/images/escencia.jpeg') }}" data-holder-rendered="true">
                        </div>
                        <div class="card-body">
                            <h3>{{$escencias_relacionada->nombre}}</h3>
                        </div>
                        <div class="card-footer">
                            <div class="col-md-12">
                                <label id="labelTipo"><strong>TIPO</strong>: <span style="color:rgb(216, 208, 208)">escencia</span></label>
                            </div>
                            <div class="col-md-12">
                                <a type="button" class="btn"  href="/escencia/{{$escencias_relacionada->idproducto}}" id="buttoncardfoooter">CONOCE M&Aacute;S</a>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
            @endif
        </div>
        <div class="row py-3">
            <a type="button" class="btn" href="#" id="buttoncargarescencias">CARGAR M&Aacute;S ESCENCIAS</a>
        </div>
    </div>
</div>
<script>
    function fAgregarAlCarrito(idProducto){
        $.ajax({
            type: "GET",
            url: "{{ asset('/escencia/carrito') }}",
            data: { id:idProducto },
            async: true,
            dataType: "json",
            success: function (respuesta) {
                if (respuesta.err = "0") {
                    $("#cantidadDeProductos").html(respuesta.cantidad);
                } else {
                    alert("Error");
                }
            }
        });   
    }
</script>
@endsection