@extends('layouts.app')

@section('title', $title ?? 'Blog de Transporte de Cargas | CoteFrete')

@section('meta')
<meta name="description" content="{{ $meta ?? 'Artigos originais sobre transporte de cargas, logística e frete. Torne o Blog CoteFrete sua fonte de referência para conteúdos no setor de transportes' }}">
<meta name="robots" content="index, follow">
<meta name="author" content="CoteFrete">
<meta property="og:title" content="{{ $title ?? 'Blog de Transporte de Cargas | CoteFrete' }}">
<meta property="og:url" content="{{ $url_canonical ?? url()->current() }}">
<meta property="og:description" content="{{ $meta ?? 'Artigos originais sobre transporte de cargas, logística e frete. Torne o Blog CoteFrete sua fonte de referência para conteúdos no setor de transportes' }}">
<meta property="og:image" itemprop="image" content="{{ asset('assets/img/img-comp.webp') }}">
<link rel="shortcut icon" href="/assets/img/fav.ico">
<link rel="canonical" href="{{ $url_canonical ?? url()->current() }}">
<link rel="preload" href="https://fonts.gstatic.com/s/montserrat/v26/JTUSjIg1_i6t8kCHKm459WlhyyTh89Y.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="/assets/css/style.min.css?v=86" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="/assets/css/style.min.css?v=86"></noscript>
@if(isset($posts) && count($posts) > 0)
  @include('partials.include-sitemap')
@else
  @include('partials.retirar-sitemap')
@endif
@endsection

@push('styles')
<link rel="stylesheet" href="{{ asset('assets/css/blog-site.css') }}">
@endpush

@section('content')

<div style='margin-top: 40px; background: rgb(201,81,29); background: linear-gradient(90deg, rgba(201,81,29,1) 0%, rgba(242,110,53,1) 50%, rgba(201,81,29,1) 100%);'>
  <div class='container'>
    <div class='row'>
      <div class='bg-news'>
        <div class='col-md-5 pr20 fw600 white' style='font-size: 17px;'>
          Cadastre seu email para receber conteúdos e informações exclusivas sobre transportes e fretes!
        </div>
        <div class='col-md-2 df-ac-jc'>
          <img loading="lazy" src="{{ asset('assets/img/download-icon.webp') }}" style='width: 100px; height: 100px' alt="Inscrição Newsletter">
        </div>
        <form id="cadastra_news" action="javascript:void(0)" class='col-md-5 pl20 pl0m mt10m w100m'>
          <input id="input_email" class='rota-sel black fw500 fs16 br7 cpt w100' type="email" placeholder='Digite seu melhor e-mail' required>
          <button class='btn-news b-none fwb br7 bg-blue white mt10 w100 fs15'>Cadastrar
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-right-circle" viewBox="0 0 16 16">
              <path fill-rule="evenodd" d="M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8zm15 0A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
            </svg>
          </button>
        </form>
      </div>
    </div>
  </div>
</div>

<div class='container mt30'>
  <div class='row'>
    <div class='col-lg-12 pd25'>
      <div class='alinha-especiais bg-f2 br7 p20 bg-f2 w100 linha coluna-m pad-alinhamento'>
        <div class='col-md-10 p0m w100m'>
          <label class='fw600'>Busque por um post específico:</label>
          <input id="input_pesquisar" value="{{ $pesquisa ?? '' }}" type="text" class='rota-sel black fw500 fs16 br7 cpt w100' style='border-radius: 0; padding: 15px 18px' placeholder='Ex: Transportadoras de veículos'>
        </div>
        <div class='col-md-2 w100m'>
          <button id='btn_pesquisar' class='p15 bg-blue white w100 b-none'>Pesquisar</button>
        </div>
      </div>
    </div>
    <div class='w100 linha coluna-mr mb100 mb50m mt30' style='align-items: initial'>
      <div class='col-md-4 pdcol grude' id='side' style='gap: 30px; display: flex; flex-direction: column'>
        <div class='bg-f2 w100'>
          <div class='tag-recentes df-ac-jc'>
            <span class='txt-recentes black fs24 fw600'>Faça uma cotação!</span>
          </div>
          <div style='padding: 20px; background-color: #f7f7f7'>
            <a href='{{ url("/cotacao") }}' class='p15 bg-blue white df-ac-jc w100 cpt'>
              <div class='fw600 white'>Cotar frete</div>
            </a>
          </div>
        </div>
        <div class='bg-f2 w100 desk'>
          <div class='tag-recentes df-ac-jc gap10'>
            <span class='txt-recentes black fs24 fw600'>Artigos Recentes</span>
            <img loading="lazy" src="{{ asset('assets/img/recente.svg') }}" style='width: 24px; height: 24px; margin-right: 10px' alt="Postagens recentes">
          </div>
          <div class='coluna p20 gap10'>
            @foreach($artigos_recentes ?? [] as $artigo)
              <a href='{{ url("/postagem/{$artigo->url}") }}' class='artigo-recente p5-10 black bg-white cpt w100'>
                <span class='lh16 txt-cap fs15 black'>{{ $artigo->titulo }}</span>
              </a>
            @endforeach
          </div>
        </div>
        <div class='bg-f2 w100 mb30m'>
          <div class='tag-recentes df-ac-jc gap10'>
            <span class='txt-recentes black fs24 fw600'>Categorias</span>
            <img loading="lazy" src="{{ asset('assets/img/tag-branca.svg') }}" style='width: 24px; height: 24px; margin-right: 10px' alt="Categorias do Blog">
          </div>
          <div style='padding: 20px' class='p20'>
            <label for="cat_blog" class='fw600'>Filtre pela categoria</label>
            <select id='cat_blog' class='rota-sel black fw500 fs16 br7 cpt w100'>
              @if(isset($nome_categoria) && $nome_categoria !== "")
                <option value='{{ $nome_categoria }}' hidden>{{ $nome_categoria }}</option>
                <option value=''>Todos</option>
              @else
                <option value='' disabled selected>Todos</option>
              @endif
              @foreach($categorias ?? [] as $categoria)
                @php
                  $nome_href = strtolower(str_replace(" ", "-", $categoria->nome));
                  $nome_sem_acento = str_replace(array("ã","á","à","â","ä","ã","é","è","ê","ë","í","ì","î","ï","ó","ò","ô","ö","õ","ú","ù","û","ü","ç","´",":"), array("a","a","a","a","a","a","e","e","e","e","i","i","i","i","o","o","o","o","o","u","u","u","u","c","", ""), $nome_href);
                @endphp
                <option value='{{ $nome_sem_acento }}'>{{ $categoria->nome }}</option>
              @endforeach
            </select>
          </div>
        </div>
        @if(isset($anuncio_lateral))
          <a href='{{ $anuncio_lateral->href }}' target='_blank' rel="nofollow noopener" class='bg-f2 w100 desk mb30 p20' style='background-color: #f7f7f7;'>
            <div class='ppg-img bp-center bs-cover p20 w100 df-ac-jc' style='background-image:url({{ asset($anuncio_lateral->img) }})'>
            </div>
          </a>
        @endif
        <div id='fixed'></div>
      </div>
      <div class='col-md-8 pdcol coluna' style='gap: 30px; justify-content: flex-start'>
        @if(isset($posts) && count($posts) > 0)
          @if(isset($resultado_categoria) && $resultado_categoria)
            <h1 class='w100' style='text-align: left; font-size: 26px; position: relative; top: 20px;'>Tudo sobre <span class='blue fwb'>{{ $nome_categoria }}</span>: Posts e Notícias</h1>
          @endif
          @foreach ($posts as $row)
            @php
              $id_post = $row->id;
              $titulo = $row->titulo;
              $created_at = $row->created_at;
              $url = $row->url;
              $resumo = nl2br($row->resumo);
              if (strlen($resumo) > 250) {
                $resumo = substr($resumo, 0, 250) . "...";
              }
              $categoria = explode(",", $row->categoria);
              $nomes_cats = array();

              foreach ($categoria as $cat_atual) {
                $cat_info = $categorias_blog->firstWhere('id', $cat_atual);
                if($cat_info) {
                  $nome_ext = $cat_info->nome;
                  $nome_href_cat = strtolower(str_replace(" ", "-", $cat_info->nome));
                  $nome_sem_acento_cat = str_replace(array("ã","á","à","â","ä","ã","é","è","ê","ë","í","ì","î","ï","ó","ò","ô","ö","õ","ú","ù","û","ü","ç","´",":"), array("a","a","a","a","a","a","e","e","e","e","i","i","i","i","o","o","o","o","o","u","u","u","u","c","", ""), $nome_href_cat);
                  $nome_cat = "<a href='/blog/$nome_sem_acento_cat/pagina-1' style='color: black !important;'>$nome_ext</a>";
                  $nomes_cats[] = $nome_cat;
                }
              }

              $categorias_juntas = implode(' / ', $nomes_cats);
              $img = $row->img;
              $count = $comentarios_count[$id_post] ?? 0;

              if($count == 0){
                $txt_comentario = "Seja o primeiro a comentar!";
              }else{
                if($count == 1){
                  $comentario = " comentario";
                }else if($count < 10){
                  $num_count= "0".$count;
                  $comentario = " comentarios";
                }else{
                  $num_count = $count;
                  $comentario = " comentarios";
                }
                $txt_comentario = $count.$comentario;
              }

              $date = new DateTime($created_at);
              $dia = $date->format('d');
              $mes = $date->format('F');
              $ano = $date->format('Y');

              $meses = [
                'January' => 'Janeiro',
                'February' => 'Fevereiro',
                'March' => 'Março',
                'April' => 'Abril',
                'May' => 'Maio',
                'June' => 'Junho',
                'July' => 'Julho',
                'August' => 'Agosto',
                'September' => 'Setembro',
                'October' => 'Outubro',
                'November' => 'Novembro',
                'December' => 'Dezembro'
              ];
              $mes_portugues = $meses[$mes] ?? $mes;
              $data_formatada = ucfirst("$dia de $mes_portugues de $ano");
            @endphp
            <div class='p20 bg-f2 coluna w100' style='background-color: #f7f7f7;'>
              <div class='linha w100' style='gap: 20px; justify-content: left'>
                <div class='linha' style='gap: 5px'>
                  <img src="{{ asset('assets/img/tag.svg') }}" style='width: 18px; height: 18px; position: relative; bottom: 2px' alt='Categorias do Post'>
                  <span class='black fw500 fs16'>{!! $categorias_juntas !!}</span>
                </div>
                <div class='linha' style='justify-content: left; gap: 5px'>
                  <img src="{{ asset('assets/img/calendar.svg') }}" style='width: 18px; height: 18px; position: relative; bottom: 2px' alt='Data do Post: {{ $data_formatada }}'>
                  <span class='black fw500 fs16'>{{ $data_formatada }}</span>
                </div>
                <a href='{{ url("/postagem/$url#responder") }}' class='linha' style='justify-content: left; gap: 5px'>
                  <img src="{{ asset('assets/img/chat.svg') }}" style='width: 18px; height: 18px; position: relative; bottom: 2px' alt='Comentários do Post'>
                  <span class='black fw500 fs16' style='text-decoration: underline'>{{ $txt_comentario }}</span>
                </a>
              </div>
              <a href='{{ url("/postagem/$url") }}' style='padding: 15px 0' class='w100'>
                <span class='blue' style='font-weight: 600; font-size: 22px'>{{ $titulo }}</span>
              </a>
              <div class='w100 linha coluna-m df-afs'>
                <div class='col-md-4 w100m'>
                  <div class='w100m br7 ovf-hd'>
                    <img loading='lazy' src="{{ asset($img) }}" class='img-blog w100' alt='Imagem do Post {{ $titulo }}'>
                  </div>
                </div>
                <div class='col-md-8'>
                  <div class='p0m mt10m' style='padding: 0 10px' class='coluna'>
                    <span class='conteudo-postagem fs16'>{!! $resumo !!}</span>
                    <div class='w100 txt-center-m' style='justify-content: left'>
                      <a class='btn-blog b-blue txt-cap bg-white br7 fw600 fs15' href='{{ url("/postagem/$url") }}'>Leia Mais</a>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          @endforeach
        @endif
        <div class="col-xs-12 col-sm-12 col-md-12">
          <ul id="paginacao" data-pagina='{{ $esta_pagina ?? 1 }}' class="pagination txt-center">
            @if(isset($num_paginas) && $num_paginas > 0)
              @php
                $url_base = request()->url();
                $last_hyphen_position = strrpos($url_base, "-");
                if ($last_hyphen_position !== false) {
                  $item_0 = substr($url_base, 0, $last_hyphen_position);
                }

                $penultima = $num_paginas - 1;
                $antipenultima = $num_paginas - 2;
                $metade_paginas = ceil($num_paginas/2);
                $tres_ultimos = $num_paginas - 3;
                $pagina_anterior = ($esta_pagina ?? 1) - 1;
                $pagina_seguinte = ($esta_pagina ?? 1) + 1;
                $primeiro_dots = ceil(($esta_pagina ?? 1)/2);
                $segundo_dots = ceil(($num_paginas - ($esta_pagina ?? 1))/2) + ($esta_pagina ?? 1);
              @endphp

              @if($num_paginas <= 6)
                @for ($i = 1; $i <= $num_paginas; $i++)
                  <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $i }}'>{{ $i }}</a></li>
                @endfor
              @elseif (($esta_pagina ?? 1) >= 4 && ($esta_pagina ?? 1) < $antipenultima)
                @for ($i = 0; $i < $num_paginas; $i++)
                  @if($i == 0)
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-1'>1</a></li>
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $primeiro_dots }}'>...</a></li>
                  @endif
                  @if($i == $pagina_anterior - 1)
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $pagina_anterior }}'>{{ $pagina_anterior }}</a></li>
                  @endif
                  @if($i == ($esta_pagina ?? 1) - 1)
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $esta_pagina ?? 1 }}'>{{ $esta_pagina ?? 1 }}</a></li>
                  @endif
                  @if($i == $pagina_seguinte - 1)
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $pagina_seguinte }}'>{{ $pagina_seguinte }}</a></li>
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $segundo_dots }}'>...</a></li>
                  @endif
                  @if($i == $num_paginas - 1)
                    <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $num_paginas }}'>{{ $num_paginas }}</a></li>
                  @endif
                @endfor
              @elseif (($esta_pagina ?? 1) >= $antipenultima)
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-1'>1</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $metade_paginas }}'>...</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $tres_ultimos }}'>{{ $tres_ultimos }}</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $antipenultima }}'>{{ $antipenultima }}</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $penultima }}'>{{ $penultima }}</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $num_paginas }}'>{{ $num_paginas }}</a></li>
              @else
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-1'>1</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-2'>2</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-3'>3</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-4'>4</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $metade_paginas }}'>...</a></li>
                <li class='paginacao'><a class='cpt p0' href='{{ $item_0 ?? $url_base }}-{{ $num_paginas }}'>{{ $num_paginas }}</a></li>
              @endif
            @endif
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection

@push('scripts')
<script src="/assets/js/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
<script async src="/assets/js/custom.min.js"></script>
<script async src="/assets/js/blog.js"></script>
@endpush