@extends('site.zbase::layout')
@section('content')
<div class="conteudo">
	<div class="topo-cont">
		<h2 class="tit-pagina font-5">Produtos</h2>
	</div>
	<section class="inner-conteudo">
		<div class="wrap-nomeproduto">
			<a href="#" class="link-voltarpagina font-4 js-backLink">Voltar página</a>
			<h1 class="nome-produto font-5">{{ $produto->nome }}</h1>
		</div>
		<div class="cont-prod">
            @if($assets->count())
			<div class="container-carrossel">
				<div class="carr-prod2">
                    @foreach($assets as $cada)
                    <div class="slide-prod" data-src="{{ asset('storage/produtos/imagens/originais/' . $cada->caminho) }}">
                        <img src="{{ asset('storage/produtos/imagens/'.$cada->caminho) }}" alt="{{ $cada->legenda }}" />
                    </div>
                    @endforeach
				</div>
				<div class="div-legenda font-4">
					<div class="cell">
						<p>{{ $assets->get(0)->legenda }}</p>
					</div>
				</div>
                @if($assets->count() > 1)
				<div class="div-carrthumb">
					<button class="seta-thumb thumb-esq"></button>
					<div class="carr-thumb">
                        @foreach($assets as $cada)
                        <div class="js-thumb">
                            <a href="#" class="thumb" style="float:none; margin:0 auto;">
                                <img src="{{ asset('storage/produtos/imagens/'.$cada->caminho) }}" alt="{{ $cada->legenda }}" />
                            </a>
                        </div>
                        @endforeach
					</div>
					<button class="seta-thumb thumb-dir"></button>
				</div>
				<button class="seta-carrprod2 prod2-esq"></button>
				<button class="seta-carrprod2 prod2-dir"></button>
                @endif
			</div>
            @endif
			<div class="container-info">
				<p class="txt-continfo1 font-3">Variações</p>
				<div class="wrap-btprodinfo">
                @foreach($modelos as $cada)
					@if($desconto)
                    <button class="bt-selectinfo font-5" data-est="{{ $cada->estoque }}" data-tam="{{ $cada->slug }}" data-preco="{{ $cada->preco }}" data-preco-desc="{{ PrecosHelper::calculaDesconto($cada) }}">{{ $cada->nome }}</button>
					@else
					<button class="bt-selectinfo font-5" data-est="{{ $cada->estoque }}" data-tam="{{ $cada->slug }}" data-preco="{{ $cada->preco }}">{{ $cada->nome }}</button>
					@endif
                @endforeach
				</div>
				<div class="quantidadeinfo-ext">
					<p class="txt-quantinfo font-3">Qtd.</p>
                    {!! Form::open(['route'=>['carrinho.comprar', $produto->slug], 'id'=>'form-'.$produto->slug, 'class'=>'wrap-quantinfo']) !!}
						<button class="bt-quantinfo font-3" data-op="menos">-</button>
                        {!! Form::text('quantidade', 1, ['data-max'=>0, 'class'=>'num-quantinfo font-3']) !!}
						<button class="bt-quantinfo font-3" data-op="mais">+</button>
                        {!! Form::hidden('modelos_slug') !!}
                    {!! Form::close() !!}
				</div>
                <div class="js-stock">
                    @if($desconto)
                    <div class="desconto-infoext">
                        <p class="desconto-info font-3">{{ $desconto }} de desconto</p>
                    </div>
                    <p class="txt-deinfo font-5">De: R$ <span class="js-val-preco"></span></p>
                    <p class="txt-valinfo font-5">Por: R$ <span class="js-val-preco-desc"></span></p>
                    @else
                    <p class="txt-valinfo font-5">R$ <span class="js-val-preco"></span></p>
                    @endif
					<p class="txt-parcinfo font-5">em {{ $configuracao->parcelas_sem_juros }}X de <span class="js-val-parc"></span> sem juros</p>
                </div>
                <div class="js-no-stock" style="display:none;">
                    <p class="txt-indinfo font-5">Produto indisponível</p>
                </div>
                <div class="bloco-btinfo">
					<button class="bt-addinfo font-5 js-comprar">Adicionar<br />ao carrinho</button>
					<button type="submit" form="form-{{ $produto->slug }}" class="bt-comprainfo font-5 js-comprar">Comprar</button>
                    @if(auth()->guard('site')->check())
                    <button type="submit" form="form-{{ $produto->slug }}" formaction="{{ route('produtos.avisarme', $produto->slug) }}" class="bt-avisarinfo font-5 js-avisar" style="display:none;" disabled>Avise-me</button>
                    @endif
				</div>
				<div class="container-info2">
					<div class="wrap-btinfo2">
						<div class="cell">
							<button class="bt-info2 font-3" data-box="frete">frete</button>
							<span class="divide-btinfo2"></span>
							<button class="bt-info2 font-3" data-box="parcelas">Parcelamento</button>
						</div>
					</div>
					<div class="inner-info2" style="display:none;" data-box="parcelas">
						<div class="wrap-parcinfo2">
							<p class="txt-parcinfo2 font-3">Opções de parcelamento</p>
							<hr class="divide-parcinfo2">
						</div>
						<table class="tb-parcelamento font-3">
							<tr>
								<td>Nº de parcelas</td>
								<td>Valor da parcela</td>
							</tr>
						</table>
					</div>
					<div class="inner-info2" style="display:none;" data-box="frete">
	                    {!! Form::open(['route'=>['produtos.buscarFrete', $produto->slug], 'class'=>'form-freteinfo2']) !!}
							<p class="txt-freteinfo2 font-3">Frete para sua região</p>
							<hr class="divide-freteinfo2">
							<div class="wrap-freteinfo2">
                                {!! Form::text('cep', null, ['placeholder'=>'Digite seu CEP', 'class'=>'input-freteinfo2 font-3', 'maxlength'=>'9', 'required']) !!}
                                {!! Form::submit('ok', ['class'=>'envia-freteinfo2 font-3']) !!}
							</div>
							{!! Form::hidden('modelos_slug') !!}
                        {!! Form::close() !!}
						<hr class="divide2-freteinfo2">
						<table class="tb-freteinfo2 font-3 js-freteTable" style="display:none;">
							<tr>
								<td></td>
								<td>Valor</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
		</div>
	</section>
	<section class="inner-conteudo2">
        @foreach($blocos as $cada)
			@if ($cada->tipo == 'imagemTexto')
		<div class="bloco-3 bl-{{ $cada->posicao=='esquerda'?'left':'right' }}">
			<div class="img-bl3">
				<img src="{{ asset('storage/produtosBlocos/imagens/'.$cada->caminho) }}" alt="{{ $cada->titulo }}" />
			</div>
			<div class="wrapper-bl3 font-3">
				<h3>{{ $cada->titulo }}</h3>
				{!! $cada->conteudo !!}
			</div>
		</div>
			@elseif ($cada->tipo == 'texto')
		<div class="bloco-3 only-text">
			<div class="wrapper-bl3 font-1">
				<h3>{{ $cada->titulo }}</h3>
				{!! $cada->conteudo !!}
			</div>
		</div>
			@elseif ($cada->tipo == 'video')
		<div class="bloco-2">
			<div class="inner-bloco2">
				<div class="wrap-video">
					<div class="wrap-video2">
						<div class="video">
							<iframe width="560" height="315" src="{{ VideosHelper::getUrl($cada->caminho) }}" frameborder="0" allowfullscreen></iframe>
						</div>
					</div>
				</div>
			</div>
		</div>
			@endif
        @endforeach
		<hr class="divide-produtos">
		@if($relacionados->count())
		<div class="carrossel-produtos">
			<h3 class="tit-carrosselprod font-5">Recomendamos</h3>
			<div class="carr-prod">
                @foreach($relacionados as $cada)
                <div>
					<div class="box-prod" style="float:none; margin:0 auto;">
						<div class="inner-boxprod">