@extends('layouts.app')

@section('titulo', 'Fiabilidade')

@section('conteudo')
<div class="top">
    <div>
        <a href="{{ route('fichas.index') }}" class="btn b2" style="margin-bottom:8px;display:inline-block">&larr; Voltar à fila</a>
        <div class="crumb">Fiabilidade</div><h1>Fiabilidade</h1>
    </div>
</div>

<div class="card">
    <form method="GET" action="{{ route('fiabilidade') }}" class="btns" style="margin-bottom:12px">
        <input type="date" name="desde" value="{{ old('desde', request('desde')) }}" style="border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:var(--surface-2);color:var(--ink);font-family:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;font-size:13px">
        <input type="date" name="ate" value="{{ old('ate', request('ate')) }}" style="border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:var(--surface-2);color:var(--ink);font-family:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;font-size:13px">
        <button type="submit" class="btn b2">Filtrar</button>
    </form>

    <div class="wrap">
        <table>
            <tr>
                <th>Leitor</th>
                <th>Campo</th>
                <th>Certo</th>
                <th>Errado</th>
                <th>Sem leitura</th>
                <th>Total</th>
                <th>Percentagem</th>
            </tr>
            @foreach($tabela as $linha)
                <tr>
                    <td>{{ $linha['leitor'] }}</td>
                    <td>{{ $linha['campo'] }}</td>
                    <td class="mono">{{ $linha['certo'] }}</td>
                    <td class="mono">{{ $linha['errado'] }}</td>
                    <td class="mono">{{ $linha['sem_leitura'] }}</td>
                    <td class="mono">{{ $linha['total'] }}</td>
                    <td class="mono">{{ $linha['percentagem'] !== null ? $linha['percentagem'] . '%' : '—' }}</td>
                </tr>
            @endforeach
        </table>
    </div>
</div>
@endsection