@extends('layout.app')

@section('content')
    <div class="container-fluid">

        {{-- Filter card --}}
        <div class="card mb-3">
            <div class="card-header">
                <h4 class="card-title mb-0">{{ $page_title }}</h4>
            </div>
            <div class="card-body">
                <form action="{{ route('new-line-status-summary') }}" method="GET">
                    <div class="row">
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>From Date</label>
                                <input type="date" name="from_date" class="form-control form-control-sm"
                                    value="{{ request('from_date', now()->startOfMonth()->format('Y-m-d')) }}">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="form-group">
                                <label>To Date</label>
                                <input type="date" name="to_date" class="form-control form-control-sm"
                                    value="{{ request('to_date', now()->endOfMonth()->format('Y-m-d')) }}">
                            </div>
                        </div>

                        <div class="col-md-6 d-flex align-items-end justify-content-end">
                            <a href="{{ route('new-line-status-summary') }}" class="btn btn-secondary btn-sm mr-2">Reset</a>
                            <button type="submit" class="btn btn-primary btn-sm">Search</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        {{-- Check menu match for a specific id --}}
        <div class="card mb-3">
            <div class="card-header">
                <h5 class="card-title mb-0">Check Menu Match for a Specific ID</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('new-line-status-summary') }}" method="GET">
                    <input type="hidden" name="from_date" value="{{ request('from_date') }}">
                    <input type="hidden" name="to_date" value="{{ request('to_date') }}">
                    <input type="hidden" name="bucket" value="{{ request('bucket') }}">

                    <div class="row">
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>New Line Request ID</label>
                                <input type="number" name="explain_id" class="form-control form-control-sm"
                                    value="{{ $explainId }}" placeholder="e.g. 15472">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="form-group">
                                <label>Menu</label>
                                <select name="explain_menu" class="form-control form-control-sm">
                                    <option value="">Select Menu</option>
                                    @foreach ($selectableMenus as $menu)
                                        <option value="{{ $menu }}" {{ $explainMenu === $menu ? 'selected' : '' }}>
                                            {{ $menu }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="col-md-6 d-flex align-items-end">
                            <button type="submit" class="btn btn-primary btn-sm">Check</button>
                        </div>
                    </div>
                </form>

                @if ($explanation)
                    <hr>

                    @if (!$explanation['found'])
                        <div class="alert alert-danger mb-0">Record #{{ $explainId }} was not found in
                            new_line_requests.</div>
                    @elseif (empty($explanation['checks']))
                        <div class="alert alert-warning mb-0">Please select a menu to check against.</div>
                    @else
                        <div class="alert {{ $explanation['matches'] ? 'alert-success' : 'alert-danger' }} mb-0">
                            <strong>
                                {{ $explanation['matches'] ? '✔ MATCH' : '✘ NOT MATCH' }} —
                                Record #{{ $explainId }}
                                {{ $explanation['matches'] ? 'does' : 'does NOT' }}
                                belong in <em>{{ $explanation['target_menu'] }}</em>.
                            </strong>
                        </div>

                        <ul class="list-group mt-3">
                            @foreach ($explanation['checks'] as $check)
                                <li
                                    class="list-group-item d-flex justify-content-between align-items-start {{ $check['pass'] ? '' : 'list-group-item-danger' }}">
                                    <div>
                                        <span
                                            class="{{ $check['pass'] ? 'text-success' : 'text-danger' }} font-weight-bold">
                                            {{ $check['pass'] ? '✔' : '✘' }}
                                        </span>
                                        {{ $check['label'] }}
                                        <div class="text-muted small">{{ $check['detail'] }}</div>
                                    </div>
                                </li>
                            @endforeach
                        </ul>

                        @if (!$explanation['matches'])
                            <p class="text-muted mt-2 mb-0">
                                Based on its current data, this record actually falls under:
                                <strong>{{ $explanation['actual_menu'] }}</strong>
                            </p>
                        @endif
                    @endif
                @endif
            </div>
        </div>

        @php
            $cards = [
                ['key' => 'total', 'label' => 'Total Created', 'count' => $total, 'color' => 'primary'],
                ['key' => 'quick_request', 'label' => 'Quick Request', 'count' => $quick, 'color' => 'info'],
                ['key' => 'new_line', 'label' => 'New Line', 'count' => $newLine, 'color' => 'success'],
                ['key' => 'confirm', 'label' => 'Confirm', 'count' => $confirm, 'color' => 'warning'],
                ['key' => 'other', 'label' => 'Other (Not Categorized)', 'count' => $other, 'color' => 'danger'],
            ];
        @endphp

        {{-- Summary cards --}}
        <div class="row">
            @foreach ($cards as $card)
                <div class="col-md-4 col-sm-6 mb-3">
                    <a href="{{ route('new-line-status-summary', array_merge(request()->except('bucket'), ['bucket' => $card['key']])) }}"
                        class="text-decoration-none">
                        <div
                            class="card text-white bg-{{ $card['color'] }} h-100 {{ $bucket === $card['key'] ? 'border border-dark' : '' }}">
                            <div class="card-body text-center">
                                <h6 class="card-title">{{ $card['label'] }}</h6>
                                <h2 class="mb-0">{{ $card['count'] }}</h2>
                            </div>
                        </div>
                    </a>
                </div>
            @endforeach
        </div>

        {{-- Drill-down list --}}
        @if ($bucket)
            <div class="card mt-3">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h5 class="mb-0">
                        {{ collect($cards)->firstWhere('key', $bucket)['label'] ?? 'List' }} — {{ $lists->count() }}
                        record(s)
                    </h5>
                    <div>
                        <a href="{{ route('new-line-status-summary.export', request()->only(['bucket', 'from_date', 'to_date'])) }}"
                            class="btn btn-sm btn-success">Export to Excel</a>
                        <a href="{{ route('new-line-status-summary', request()->except('bucket')) }}"
                            class="btn btn-sm btn-outline-secondary">Close List</a>
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive" style="max-height: 600px;">
                        <table class="table table-bordered table-sm table-striped">
                            <thead>
                                <tr>
                                    <th style="white-space: nowrap;">Menu Match</th>
                                    @foreach ($columns as $column)
                                        <th style="white-space: nowrap;">{{ $column }}</th>
                                    @endforeach
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($lists as $row)
                                    <tr>
                                        @php
                                            if ($row->menu_match === 'Not Match') {
                                                $menuMatchClass = 'text-danger';
                                            } elseif (in_array($row->menu_match, ['Successfully Complete', 'Area Not Coverage', 'Line Cancel'])) {
                                                $menuMatchClass = 'text-muted';
                                            } else {
                                                $menuMatchClass = 'text-success';
                                            }
                                        @endphp
                                        <td style="white-space: nowrap;" class="{{ $menuMatchClass }} font-weight-bold">
                                            {{ $row->menu_match }}
                                        </td>
                                        @foreach ($columns as $column)
                                            <td style="white-space: nowrap;">{{ $row->{$column} }}</td>
                                        @endforeach
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="{{ count($columns) + 1 }}" class="text-center">No records found</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        @endif

    </div>
@endsection