@extends('layouts.app')
@section('title', 'Material Usage by Project')

@section('content')
    <div class="mb-4">
        <h1 class="page-title"><i class="bi bi-bar-chart me-2"></i>Material Usage by Project</h1>
    </div>

    <!-- Filters -->
    <div class="card card-body mb-4">
        <form method="GET" class="row g-3 align-items-end">
            <div class="col-md-3">
                <label class="form-label">Project</label>
                <select name="project_id" class="form-select">
                    <option value="">All Projects</option>
                    @foreach($projects as $proj)
                        <option value="{{ $proj->id }}" {{ request('project_id') == $proj->id ? 'selected' : '' }}>
                            {{ $proj->project_name }}
                        </option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-2">
                <label class="form-label">From</label>
                <input type="date" name="from" class="form-control" value="{{ request('from') }}">
            </div>
            <div class="col-md-2">
                <label class="form-label">To</label>
                <input type="date" name="to" class="form-control" value="{{ request('to') }}">
            </div>
            <div class="col-md-2">
                <button type="submit" class="btn btn-outline-primary w-100"><i class="bi bi-filter"></i> Filter</button>
            </div>
        </form>
    </div>

    @forelse($report as $projectName => $materials)
        <div class="card mb-3">
            <div class="card-header"><strong><i class="bi bi-building me-1"></i>{{ $projectName }}</strong></div>
            <div class="table-responsive">
                <table class="table mb-0">
                    <thead>
                        <tr>
                            <th>Material</th>
                            <th>Unit</th>
                            <th class="text-end">Quantity Used</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($materials as $matName => $data)
                            <tr>
                                <td>{{ $matName }}</td>
                                <td>{{ strtoupper($data['unit']) }}</td>
                                <td class="text-end fw-bold">{{ number_format($data['quantity'], 2) }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    @empty
        <div class="card">
            <div class="card-body text-center text-muted py-4">
                No usage data found for the selected filters.
            </div>
        </div>
    @endforelse
@endsection