@extends('layouts.main')
@section('title', 'Relatórios')

@section('content')
@php
$user = Auth::user();
@endphp

<div class="container d-flex justify-content-center align-items-center">
    <div class="card shadow p-4 col-12" >
<h3 class="text-center text-primary mb-4">Relatórios PsicoSocial</h3>

<ul class="nav nav-tabs mb-4" id="moduloTabs" role="tablist">
    @php
        $modulos = ['estresse', 'assedio', 'deficiencia', 'acoes', 'sociofamiliares'];
    @endphp
    @foreach ($modulos as $i => $mod)
        <li class="nav-item" role="presentation">
            <button class="nav-link {{ $i === 0 ? 'active' : '' }}" id="{{ $mod }}-tab" data-bs-toggle="tab" data-bs-target="#{{ $mod }}" type="button" role="tab">
                {{ ucfirst($mod) }}
            </button>
        </li>
    @endforeach
</ul>

<div class="tab-content" id="moduloTabsContent">
    @foreach ($modulos as $i => $mod)
        <div class="tab-pane fade {{ $i === 0 ? 'show active' : '' }}" id="{{ $mod }}" role="tabpanel">
            <h5 class="mb-3">Módulo: {{ ucfirst($mod) }}</h5>

            <div class="table-responsive">
                <table class="table table-bordered table-striped small">
                    <thead class="table-primary">
                        <tr>
                            <th>Data</th>
                            <th>Setor</th>
                            <th>Escolaridade</th>
                            <th>Respostas</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($dados[$mod] as $linha)
                            <tr>
                                <td>{{ $linha['data'] }}</td>
                                <td>{{ $linha['setor'] }}</td>
                                <td>{{ $linha['escolaridade'] }}</td>
                                <td>
                                    @foreach (json_decode($linha['respostas'], true) as $r)
                                        <span class="badge bg-secondary me-1">{{ $r }}</span>
                                    @endforeach
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    @endforeach
</div>
    </div>
</div>
@endsection