@extends('layouts.app')
@section('title', 'Laporan Servis')
@section('breadcrumb')
    <li class="breadcrumb-item active">Laporan Servis</li>
@endsection
@section('content')
<div class="page-header d-flex align-items-center justify-content-between">
    <h4><i class="bi bi-bar-chart-line me-2 text-primary"></i>Laporan Servis</h4>
    @if(auth()->user()->isHO())
        <span class="badge bg-warning-subtle text-warning border border-warning-subtle">
            <i class="bi bi-building me-1"></i>HO — Semua Cabang
        </span>
    @else
        <span class="badge bg-info-subtle text-info border border-info-subtle">
            <i class="bi bi-building me-1"></i>{{ auth()->user()->branch->name ?? 'Cabang' }}
        </span>
    @endif
</div>

<div class="card mb-3">
    <div class="card-body">
        <form method="GET" class="row g-2">
            <div class="col-md-3">
                <label class="form-label small">Dari Tanggal</label>
                <input type="date" name="date_from" class="form-control" value="{{ $dateFrom }}">
            </div>
            <div class="col-md-3">
                <label class="form-label small">Sampai Tanggal</label>
                <input type="date" name="date_to" class="form-control" value="{{ $dateTo }}">
            </div>
            <div class="col-md-3">
                <label class="form-label small">Status</label>
                <select name="status" class="form-select">
                    <option value="">Semua Status</option>
                    @foreach(['pending'=>'Menunggu','diagnosa'=>'Diagnosa','proses'=>'Proses','menunggu_part'=>'Menunggu Part','selesai'=>'Selesai','diambil'=>'Diambil','batal'=>'Dibatalkan'] as $v => $l)
                    <option value="{{ $v }}" {{ request('status') === $v ? 'selected' : '' }}>{{ $l }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-3">
                <label class="form-label small">Teknisi</label>
                <select name="technician_id" class="form-select">
                    <option value="">Semua Teknisi</option>
                    @foreach($technicians as $tech)
                    <option value="{{ $tech->id }}" {{ request('technician_id') == $tech->id ? 'selected' : '' }}>{{ $tech->user->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-12 d-flex gap-2">
                <button type="submit" class="btn btn-primary">Tampilkan Laporan</button>
                <a href="{{ route('reports.service') }}" class="btn btn-outline-secondary">Reset</a>
            </div>
        </form>
    </div>
</div>

{{-- Summary Cards --}}
<div class="row g-3 mb-3">
    <div class="col-6 col-md-2">
        <div class="card text-center"><div class="card-body py-3">
            <div class="fs-4 fw-bold">{{ $summary['total'] }}</div>
            <div class="text-muted small">Total Order</div>
        </div></div>
    </div>
    <div class="col-6 col-md-2">
        <div class="card text-center border-warning"><div class="card-body py-3">
            <div class="fs-4 fw-bold text-warning">{{ $summary['pending'] }}</div>
            <div class="text-muted small">Pending</div>
        </div></div>
    </div>
    <div class="col-6 col-md-2">
        <div class="card text-center border-primary"><div class="card-body py-3">
            <div class="fs-4 fw-bold text-primary">{{ $summary['proses'] }}</div>
            <div class="text-muted small">Proses</div>
        </div></div>
    </div>
    <div class="col-6 col-md-2">
        <div class="card text-center border-success"><div class="card-body py-3">
            <div class="fs-4 fw-bold text-success">{{ $summary['selesai'] }}</div>
            <div class="text-muted small">Selesai</div>
        </div></div>
    </div>
    <div class="col-6 col-md-2">
        <div class="card text-center"><div class="card-body py-3">
            <div class="fs-4 fw-bold text-secondary">{{ $summary['diambil'] }}</div>
            <div class="text-muted small">Diambil</div>
        </div></div>
    </div>
    <div class="col-6 col-md-2">
        <div class="card text-center border-danger"><div class="card-body py-3">
            <div class="fs-4 fw-bold text-danger">{{ $summary['batal'] }}</div>
            <div class="text-muted small">Dibatalkan</div>
        </div></div>
    </div>
</div>

<div class="row g-3 mb-3">
    @if($byDevice->count() > 0)
    <div class="col-md-4">
        <div class="card h-100">
            <div class="card-header py-3"><h6 class="mb-0 fw-bold">Order per Tipe Perangkat</h6></div>
            <div class="card-body p-0">
                <table class="table mb-0">
                    @foreach($byDevice as $device => $count)
                    <tr>
                        <td class="small">{{ $device }}</td>
                        <td class="text-end"><span class="badge bg-primary">{{ $count }}</span></td>
                        <td style="width:100px;">
                            <div class="progress" style="height:6px;">
                                <div class="progress-bar" style="width:{{ ($count / max($byDevice->values()->max(), 1)) * 100 }}%"></div>
                            </div>
                        </td>
                    </tr>
                    @endforeach
                </table>
            </div>
        </div>
    </div>
    @endif
    <div class="{{ $byDevice->count() > 0 ? 'col-md-8' : 'col-12' }}">
        <div class="card">
            <div class="card-header py-3"><h6 class="mb-0 fw-bold">Daftar Order ({{ $orders->count() }})</h6></div>
            <div class="table-responsive" style="max-height:400px;overflow-y:auto;">
                <table class="table table-hover table-sm mb-0">
                    <thead class="sticky-top">
                        <tr><th>No. Order</th><th>Pelanggan</th><th>Perangkat</th><th>Teknisi</th><th>Tgl Masuk</th><th>Status</th></tr>
                    </thead>
                    <tbody>
                        @forelse($orders as $order)
                        <tr>
                            <td><a href="{{ route('service-orders.show', $order) }}" class="text-decoration-none small fw-medium">{{ $order->order_number }}</a></td>
                            <td class="small">{{ $order->customer->name }}</td>
                            <td class="small">{{ $order->deviceType->name }}</td>
                            <td class="small">{{ $order->technician?->user->name ?? '-' }}</td>
                            <td class="small">{{ $order->received_date->format('d/m/Y') }}</td>
                            <td><span class="badge bg-{{ $order->status_color }} small">{{ $order->status_label }}</span></td>
                        </tr>
                        @empty
                        <tr><td colspan="6" class="text-center text-muted py-3">Tidak ada data</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection