@extends('layouts.vertical', ['page_title' => 'Action Plan Report'])

@section('css')
    <style>
        .table-scroll {
            overflow-x: auto;
        }

        .sticky-col {
            position: sticky;
            left: 0;
            background: #fff;
            z-index: 2;
        }

        .timeline-table th,
        .timeline-table td {
            white-space: nowrap;
            text-align: center;
            vertical-align: middle;
        }
    </style>
@endsection

@section('content')
    <div class="card">
        <div class="card-header">
            <h5 class="card-title mb-0">{{ $title }} Action Plan Timeline</h5>
        </div>
        <div class="card-body table-scroll">
            @php
                // Fixed timeline & adherence columns
                $timelineCols = ['less_than_1_month', '1_month', '3_months', '6_months'];
                $adherenceCols = ['on_track', 'needs_correction', 'status_quo'];
            @endphp

            <table class="table table-bordered table-striped timeline-table">
                <thead>
                    <tr>
                        <th class="sticky-col">SBM /ME Action Plan</th>
                        <th>Total</th>
                        @foreach ($timelineCols as $col)
                            <th>{{ ucfirst(str_replace('_', ' ', $col)) }}</th>
                        @endforeach
                        @foreach ($adherenceCols as $col)
                            <th>{{ ucfirst(str_replace('_', ' ', $col)) }}</th>
                        @endforeach
                    </tr>
                </thead>
                <tbody>
                    @foreach ($response as $plan => $slugs)
                        <tr>
                            <td class="sticky-col">{{ $plan }}</td>
                            <td>{{ $slugs->total ?? 0 }}</td>
                            @foreach ($timelineCols as $col)
                                <td>{{ $slugs->{$col} ?? 0 }}</td>
                            @endforeach
                            @foreach ($adherenceCols as $col)
                                <td>{{ $slugs->{$col} ?? 0 }}</td>
                            @endforeach
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection















{{-- @extends('layouts.vertical', ['page_title' => 'Action Plan Report'])

@section('css')
<style>
    .table-scroll {
        overflow-x: auto;
    }
    .sticky-col {
        position: sticky;
        left: 0;
        background: #fff;
        z-index: 2;
    }
    .timeline-table th,
    .timeline-table td {
        white-space: nowrap;
        text-align: left;
        vertical-align: middle;
    }
</style>
@endsection

@section('content')
<div class="card">
    <div class="card-header">
        <h5 class="card-title mb-0">{{ $title }} Action Plan Timeline</h5>
    </div>
    <div class="card-body table-scroll">
        @php
            // Assuming your API response variable is $apiResponse
            $reportData = $response->data->submissions ?? [];

            // Collect all unique timelines across all action plans
            $allTimelines = collect($reportData)
                ->flatMap(fn($item) => collect($item->timelines)->pluck('timeline'))
                ->unique()
                ->values()
                ->toArray();

            // Priority sorting for last columns
            $priorityEnd = ['staus_quo', 'needs_correction', 'on_track'];
            $existingPriority = array_values(array_intersect($priorityEnd, $allTimelines));
            $remaining = array_values(array_diff($allTimelines, $existingPriority));
            $allTimelines = array_merge($remaining, $existingPriority);
        @endphp

        @if (!empty($reportData))
            <table class="table table-bordered table-striped timeline-table">
                <thead>
                    <tr>
                        <th class="sticky-col">Action Plan Item</th>
                        <th>Total Users</th>
                        @foreach ($allTimelines as $timeline)
                            <th>{{ ucfirst(str_replace('_', ' ', $timeline)) }}</th>
                        @endforeach
                    </tr>
                </thead>
                <tbody>
                    @foreach ($reportData as $row)
                        <tr>
                            <td class="sticky-col">{{ ucfirst(str_replace('_', ' ', $row->action_plan_item)) }}</td>
                            <td><strong>{{ $row->total_user_count }}</strong></td>
                            @foreach ($allTimelines as $timeline)
                                @php
                                    $count = collect($row->timelines)
                                        ->firstWhere('timeline', $timeline)->user_count ?? 0;
                                @endphp
                                <td>{{ $count }}</td>
                            @endforeach
                        </tr>
                    @endforeach
                </tbody>
            </table>
        @else
            <p>No data available.</p>
        @endif
    </div>
</div>
@endsection --}}