@extends('layouts.website')

@section('content')
<style>
    body{
        background: #fff;
    }
    .banner-interno__subtitle{
        font-size: 50px !important;
    }
</style>

<div class="container" style="margin-bottom: 100px;">
    <div class="oferta-equipe">
        <div class="main-oferta-equipe">
            <div class="vinho-oferta-equipe">
                <img src="{{ $oferta_equipe->thumbnail_principal }}" />
            </div>

            <div class="info-vinho-oferta-equipe">
                <div class="titulo-vinho-oferta-equipe">
                    <h5>{{ $oferta_equipe->titulo }}</h5>
                    <span>{{ $oferta_equipe->sub_titulo }}</span>
                </div>
                
                <div class="preco-vinho-oferta-equipe">
                    <h5>R$ {{ number_format($oferta_equipe->preco_mercado,2,',','.') }}</h5>
                    <span>R$ {{ number_format($oferta_equipe->preco_oferta,2,',','.') }}</span>
                </div>

                @php
                    $economia = $oferta_equipe->preco_mercado - $oferta_equipe->preco_oferta;
                @endphp
                @if($economia > 0)
                    <div class="economia-oferta-equipe">
                        Você economiza <span>R$ {{ number_format($economia,2,',','.') }}</span>
                    </div>
                @endif

                

                <div class="comprar-oferta-equipe">
                    <div class="inline">

                    <select class="quantidade_oferta">
                            <option value="1" selected>1</option>
                            <?php if(isset($oferta_equipe->quantidade_maxima_por_cliente)): ?>
                                <?php for($i = 2; $i <= $oferta_equipe->quantidade_maxima_por_cliente; $i++): ?>
                                    <option value="<?php echo $i; ?>"><?php echo $i; ?></option>
                                <?php endfor; ?>
                            <?php else: ?>
                                <?php for($a = 2; $a <= 10; $a++): ?>
                                    <option value="<?php echo $a; ?>"><?php echo $a; ?></option>
                                <?php endfor; ?>
                            <?php endif; ?>
                        </select>
                        <button class="btn-comprar oferta-equipe-btn" data-versao="op2">Comprar</button>
                        <!-- <button type="button" class="btn-esgotado">Oferta Esgotada</button> -->
                    </div>
                </div>  
            
                @desktop()
                <div class="texto-vinho-oferta-equipe">
                    <p>
                        {{ strip_tags($oferta_equipe->resumo_texto) }}
                    </p>
                </div>
                @enddesktop()

                @php
                    $produto = $oferta_equipe->produtos[0]->produto;
                @endphp
 
                <div class="icones-oferta-equipe">
                    <div class="icone-oferta-equipe">
                        <img src="{{ config('filesystems.path') . '/tipo-de-produto/' . $produto->tipo->thumbnail_principal }}" alt="">
                        <div class="texto-icone-oferta-equipe">{{ $produto->tipo->nome }}</div>
                    </div>

                    <div class="icone-oferta-equipe">
                        <img src="uploads/pais/{{ $produto->paisOrigem->thumbnail_principal }}" alt="">
                        <div class="texto-icone-oferta-equipe">{{ $produto->paisOrigem->nome }}</div>
                    </div>

                    <div class="icone-oferta-equipe">
                        <img src="/img/site/safra.svg" />
                        <div class="texto-icone-oferta-equipe">Safra {{ $produto->caracteristicas ? $produto->caracteristicas->safra : '' }}</div>
                    </div>

                    <div class="icone-oferta-equipe">
                        <img src="img/site/teor.svg" />
                        <div class="texto-icone-oferta-equipe">TEOR {{ $produto->caracteristicas ? $produto->caracteristicas->teor_alcoolico : '' }}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="divider-equipe"></div>

    <div>
        @include('oferta-da-equipe.components.quem-indicou')    
    </div>

    @mobile()
        <div class="divider-equipe"></div>
    @endif

    <div>
        @include('oferta-da-equipe.components.colaboradores')
    </div>
</div>


<script>

    $(document).on('ready', function(){

        $('.oferta-equipe-btn').click(function(){
            $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url:'/add-oferta-equipe',
                type:'POST',
                data:{
                    quantidade: $('.quantidade_oferta option:selected').val(),
                    id_oferta_equipe: "{{ $oferta_equipe->id }}",
                },
                beforeSend:function(){
                    $('.carregando').fadeIn();
                },
                success:function(data){
                    if(data.status){
                        window.location.href = "/checkout";
                    }else{
                        alertUtil.alertError(data.message);
                        $('.carregando').fadeOut();
                    }

                }
            });
        });
 
    });
</script>

@endsection