@extends('adminlte::page')

@section('title', 'Time Tracking Reports')

@section('content_header')
    <div class="d-flex justify-content-between align-items-center">
        <h1>Time Tracking Reports</h1>
        <div>
            <form method="GET" class="d-inline">
                <input type="date" name="start_date" value="{{ $startDate->format('Y-m-d') }}" class="form-control d-inline-block" style="width: auto;">
                <span class="mx-2">to</span>
                <input type="date" name="end_date" value="{{ $endDate->format('Y-m-d') }}" class="form-control d-inline-block" style="width: auto;">
                <button type="submit" class="btn btn-primary">Update Range</button>
            </form>
            <a href="{{ route('reports.index') }}" class="btn btn-secondary ml-2">
                <i class="fas fa-arrow-left"></i> Back to Reports
            </a>
        </div>
    </div>
@stop

@section('content')
<!-- Key Time Metrics -->
<div class="row">
    <div class="col-lg-3 col-6">
        <div class="small-box bg-info">
            <div class="inner">
                <h3>{{ number_format($timeByUser->sum('total_hours'), 1) }}</h3>
                <p>Total Hours</p>
                <small>{{ $startDate->format('M j') }} - {{ $endDate->format('M j, Y') }}</small>
            </div>
            <div class="icon">
                <i class="fas fa-clock"></i>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-6">
        <div class="small-box bg-success">
            <div class="inner">
                <h3>{{ number_format($timeByUser->sum('billable_hours'), 1) }}</h3>
                <p>Billable Hours</p>
                <small>{{ $timeByUser->sum('total_hours') > 0 ? number_format(($timeByUser->sum('billable_hours') / $timeByUser->sum('total_hours')) * 100, 1) : 0 }}% of total</small>
            </div>
            <div class="icon">
                <i class="fas fa-dollar-sign"></i>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-6">
        <div class="small-box bg-warning">
            <div class="inner">
                <h3>${{ number_format($timeByUser->sum('total_value'), 0) }}</h3>
                <p>Total Value</p>
                <small>Hours × Rates</small>
            </div>
            <div class="icon">
                <i class="fas fa-money-bill-wave"></i>
            </div>
        </div>
    </div>
    <div class="col-lg-3 col-6">
        <div class="small-box bg-danger">
            <div class="inner">
                <h3>{{ $utilizationRates->count() > 0 ? number_format($utilizationRates->avg('utilization_rate'), 1) : 0 }}%</h3>
                <p>Avg Utilization</p>
                <small>Billable vs Total</small>
            </div>
            <div class="icon">
                <i class="fas fa-percentage"></i>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <!-- Daily Time Tracking Chart -->
    <div class="col-md-8">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Daily Time Tracking</h3>
            </div>
            <div class="card-body">
                <canvas id="dailyTimeChart" height="100"></canvas>
            </div>
        </div>
    </div>

    <!-- Utilization Rates -->
    <div class="col-md-4">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Utilization Rates</h3>
            </div>
            <div class="card-body">
                @if($utilizationRates->count() > 0)
                    @foreach($utilizationRates as $user)
                        <div class="progress-group">
                            <span class="float-right"><b>{{ $user->utilization_rate }}%</b></span>
                            <span class="progress-text">{{ $user->name }}</span>
                            <div class="progress progress-sm">
                                @php
                                    $color = $user->utilization_rate >= 80 ? 'success' : 
                                            ($user->utilization_rate >= 60 ? 'warning' : 'danger');
                                @endphp
                                <div class="progress-bar bg-{{ $color }}" style="width: {{ $user->utilization_rate }}%"></div>
                            </div>
                        </div>
                    @endforeach
                @else
                    <p class="text-muted">No utilization data available for the selected period.</p>
                @endif
            </div>
        </div>
    </div>
</div>

<div class="row">
    <!-- Time by User -->
    <div class="col-md-6">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Time by User</h3>
            </div>
            <div class="card-body">
                @if($timeByUser->count() > 0)
                    <div class="table-responsive">
                        <table class="table table-sm">
                            <thead>
                                <tr>
                                    <th>User</th>
                                    <th>Total Hours</th>
                                    <th>Billable</th>
                                    <th>Value</th>
                                    <th>Utilization</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($timeByUser as $user)
                                    @php
                                        $utilization = $user->total_hours > 0 ? ($user->billable_hours / $user->total_hours) * 100 : 0;
                                    @endphp
                                    <tr>
                                        <td><strong>{{ $user->name }}</strong></td>
                                        <td>{{ number_format($user->total_hours, 1) }}h</td>
                                        <td>
                                            <span class="badge badge-success">{{ number_format($user->billable_hours, 1) }}h</span>
                                        </td>
                                        <td>${{ number_format($user->total_value, 0) }}</td>
                                        <td>
                                            @php
                                                $color = $utilization >= 80 ? 'success' : 
                                                        ($utilization >= 60 ? 'warning' : 'danger');
                                            @endphp
                                            <span class="badge badge-{{ $color }}">{{ number_format($utilization, 1) }}%</span>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                @else
                    <p class="text-muted">No time tracking data available for the selected period.</p>
                @endif
            </div>
        </div>
    </div>

    <!-- Time by Case -->
    <div class="col-md-6">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Time by Case</h3>
                <div class="card-tools">
                    <span class="badge badge-info">Top Cases</span>
                </div>
            </div>
            <div class="card-body">
                @if($timeByCase->count() > 0)
                    <div class="table-responsive">
                        <table class="table table-sm">
                            <thead>
                                <tr>
                                    <th>Case</th>
                                    <th>Total Hours</th>
                                    <th>Billable</th>
                                    <th>Avg Rate</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($timeByCase->take(10) as $case)
                                    <tr>
                                        <td>
                                            <small><strong>{{ $case->case_number }}</strong></small><br>
                                            <small class="text-muted">{{ Str::limit($case->title, 25) }}</small>
                                        </td>
                                        <td>{{ number_format($case->total_hours, 1) }}h</td>
                                        <td>
                                            <span class="badge badge-primary">{{ number_format($case->billable_hours, 1) }}h</span>
                                        </td>
                                        <td>${{ number_format($case->avg_rate, 0) }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                    @if($timeByCase->count() > 10)
                        <small class="text-muted">Showing top 10 of {{ $timeByCase->count() }} cases with time entries</small>
                    @endif
                @else
                    <p class="text-muted">No case time data available for the selected period.</p>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Time Distribution Analysis -->
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Time Distribution Summary</h3>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-3">
                        <div class="description-block">
                            <h5 class="description-header">{{ $dailyTime->count() }}</h5>
                            <span class="description-text">ACTIVE DAYS</span>
                            <small class="text-muted d-block">Days with time entries</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="description-block">
                            <h5 class="description-header">{{ $dailyTime->count() > 0 ? number_format($dailyTime->avg('total_hours'), 1) : 0 }}</h5>
                            <span class="description-text">AVG HOURS/DAY</span>
                            <small class="text-muted d-block">Across all users</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="description-block">
                            <h5 class="description-header">{{ $dailyTime->count() > 0 ? number_format($dailyTime->max('total_hours'), 1) : 0 }}</h5>
                            <span class="description-text">PEAK DAY</span>
                            <small class="text-muted d-block">Highest single day</small>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="description-block">
                            <h5 class="description-header">{{ $timeByUser->count() }}</h5>
                            <span class="description-text">ACTIVE USERS</span>
                            <small class="text-muted d-block">With time entries</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@stop

@section('js')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
// Daily Time Chart
const dailyCtx = document.getElementById('dailyTimeChart').getContext('2d');
const dailyChart = new Chart(dailyCtx, {
    type: 'line',
    data: {
        labels: [
            @foreach($dailyTime as $day)
                '{{ \Carbon\Carbon::parse($day->date_worked)->format('M j') }}',
            @endforeach
        ],
        datasets: [{
            label: 'Total Hours',
            data: [
                @foreach($dailyTime as $day)
                    {{ $day->total_hours }},
                @endforeach
            ],
            borderColor: '#007bff',
            backgroundColor: 'rgba(0, 123, 255, 0.1)',
            borderWidth: 2,
            fill: false
        }, {
            label: 'Billable Hours',
            data: [
                @foreach($dailyTime as $day)
                    {{ $day->billable_hours }},
                @endforeach
            ],
            borderColor: '#28a745',
            backgroundColor: 'rgba(40, 167, 69, 0.1)',
            borderWidth: 2,
            fill: false
        }]
    },
    options: {
        responsive: true,
        maintainAspectRatio: false,
        scales: {
            y: {
                beginAtZero: true
            }
        },
        plugins: {
            legend: {
                position: 'top'
            }
        }
    }
});
</script>
@stop