@extends('layout.padrao')
@section('content')
@include('Intranet.menu')



<div class="col col-12 margin-bottom-30 ajusteMobile">
  <div class="col margin-bottom-30">
    <h2>Colaboradores CSA</h2>
  </div>
  <div class="w-100"></div>
  <ul class="nav nav-tabs" style="margin-left:15px;">
    @foreach ($employeeGroups as $employeeGroup)
      <li id="{{$employeeGroup->description}}" class="{{ $employeeGroup->description == 'Principal' ? 'active' : '' }}"><a data-toggle="tab" href="#{{$employeeGroup->description}}">{{$employeeGroup->description}}</a></li>
    @endforeach
  </ul>
    <div class="col col-sm-12 col-md-12 col-lg-12">
      <div class="row col shadow folha-interna folha-azul rounded box padding-15" style="padding-top:100px !important;">

        <div class="tab-content col-sm-12">
          @foreach ($usuarios as $usuario)
            @if($usuario->employeeGroups() != '')
              <div class="tab-pane col-sm-4 {{$usuario->employeeGroups->description == 'Principal' ? 'active' : ''}} {{$usuario->employeeGroups->description}}" id="{{$usuario->employeeGroups->description}}" style="padding:10px;">
                <div class="profile-card">
                  <div class="profile-cardImg">
                    <img src="{{ file_exists(sprintf('storage/usuarios/%s.jpg', $usuario->id)) ? asset(sprintf('storage/usuarios/%s.jpg', $usuario->id)) : asset('storage/usuarios/no-logo.jpg') }}" id="category-img-tag">
                  </div>
                  <div class="profile-cardInfo">
                    <div class="profile-cardName" style="text-transform: capitalize;">{{ucfirst(strtolower($usuario->nome))}}</div>
                    {{-- <div class="profile-cardTxt">
                      <img src="{!! asset('/image/icons/clarity_update-line.svg') !!}" alt="bag" style="width:25px;"> 
                      <span class="employee_group_order">{{$usuario->employee_group_order ?? 'Undefined'}}° at Group Order</span>
                    </div> --}}
                    <div class="profile-cardTxt">
                      <img src="{!! asset('/image/icons/ph_bag-simple-light.svg') !!}" alt="bag"> 
                      <span class="cargo">{{$usuario->userOccupations->description ?? 'Undefined'}}</span>
                    </div>
                    <div class="profile-cardTxt">
                      <img src="{!! asset('/image/icons/fluent_mail-28-regular.svg') !!}" alt="email">
                      <span class="email">
                        <a href="mailto:{{$usuario->email}}" style="text-transform:lowercase">{{$usuario->email}}</a>
                      </span>
                    </div>
                    <div class="profile-cardTxt">
                      <img src="{!! asset('/image/icons/fluent_phone-20-regular.svg') !!}" alt="phone"> 
                      <span class="telefone">
                        <a href="tel:+{{$usuario->phone_number}}">{{$usuario->phone_number ?? 'Undefined'}}</a>
                      </span>
                    </div>
                  </div>
                </div>
              </div>
            @endif
          @endforeach
        </div>
      </div>
    </div>
  </div>
</div>

@include('Intranet.style')
@include('Intranet.colaboradores.script')
@include('Intranet.colaboradores.style')

@endSection