@extends('layouts.app')

@section('content')
    <style>
        .filter-panel { margin: 18px 0; display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end; }
        .field label { display: block; margin-bottom: 6px; font-weight: 500; }
        .field select, .field input { width: 100%; border: 1px solid #cfd8e3; border-radius: 8px; padding: 10px 12px; font: inherit; background: #fff; }
        .summary-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
        .summary-chip { border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 12px; }
        .summary-chip strong { display: block; color: var(--blue); font-size: 24px; line-height: 1; margin-bottom: 4px; }
        .classroom-band { background: #f8fafc; font-weight: 700; color: #344054; }
        .row-select { min-width: 190px; }
        .number-input { width: 84px; min-width: 84px; }
        .helper { color: var(--muted); font-size: 13px; }
        .save-bar { display: flex; justify-content: flex-end; margin-top: 16px; }
        @media (max-width: 860px) {
            .filter-panel { grid-template-columns: 1fr; }
            .summary-row { grid-template-columns: 1fr; }
        }
    </style>

    <h1 class="page-title">เลื่อนชั้น/จัดห้องปีใหม่</h1>
    <p class="page-subtitle">เลือกปี/เทอมต้นทางและปลายทาง ตรวจรายชื่อ แล้วจัดห้องปลายทางก่อนบันทึก</p>

    @if (session('status'))
        <div class="notice">{{ session('status') }}</div>
    @endif

    @if ($errors->any())
        <div class="notice" style="background:#fff4ed;border-color:#fedf89;color:#b54708;">
            {{ $errors->first() }}
        </div>
    @endif

    <form class="card filter-panel" method="get" action="{{ route('student-promotions.index') }}">
        <div class="field">
            <label for="source_academic_year_id">ปี/เทอมต้นทาง</label>
            <select id="source_academic_year_id" name="source_academic_year_id">
                <option value="">เลือกต้นทาง</option>
                @foreach ($academicYears as $year)
                    <option value="{{ $year->id }}" @selected(optional($sourceYear)->id === $year->id)>{{ $year->label }}</option>
                @endforeach
            </select>
        </div>
        <div class="field">
            <label for="target_academic_year_id">ปี/เทอมปลายทาง</label>
            <select id="target_academic_year_id" name="target_academic_year_id">
                <option value="">เลือกปลายทาง</option>
                @foreach ($academicYears as $year)
                    <option value="{{ $year->id }}" @selected(optional($targetYear)->id === $year->id)>{{ $year->label }}</option>
                @endforeach
            </select>
        </div>
        <button class="btn" type="submit">แสดงรายชื่อ</button>
    </form>

    @if ($sourceYear && $targetYear && $sourceYear->id === $targetYear->id)
        <div class="notice" style="background:#fff4ed;border-color:#fedf89;color:#b54708;">กรุณาเลือกปี/เทอมต้นทางและปลายทางคนละรายการ</div>
    @endif

    @if ($summary)
        <div class="summary-row">
            <div class="summary-chip"><strong>{{ $summary['students'] }}</strong><span>นักเรียนต้นทาง</span></div>
            <div class="summary-chip"><strong>{{ $summary['suggested'] }}</strong><span>มีห้องแนะนำ</span></div>
            <div class="summary-chip"><strong>{{ $summary['graduated'] }}</strong><span>จบการศึกษา</span></div>
        </div>

        @if ($targetClassrooms->isEmpty())
            <div class="notice" style="background:#fff4ed;border-color:#fedf89;color:#b54708;">
                ยังไม่มีห้องเรียนในปี/เทอมปลายทาง กรุณาเพิ่มห้องเรียนก่อนจัดห้อง
            </div>
        @endif

        <form method="post" action="{{ route('student-promotions.store') }}">
            @csrf
            <input type="hidden" name="source_academic_year_id" value="{{ $sourceYear->id }}">
            <input type="hidden" name="target_academic_year_id" value="{{ $targetYear->id }}">

            <div class="table-wrap">
                <table>
                    <thead>
                        <tr>
                            <th style="width:80px;">เลขที่</th>
                            <th>นักเรียน</th>
                            <th style="width:150px;">ห้องเดิม</th>
                            <th style="width:260px;">ห้องปลายทาง</th>
                            <th style="width:110px;">เลขที่ใหม่</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php $currentSource = null; @endphp
                        @forelse ($rows as $index => $row)
                            @php
                                $source = $row['source_classroom'];
                                $student = $row['student'];
                                $sourceKey = $source->id;
                            @endphp

                            @if ($currentSource !== $sourceKey)
                                @php $currentSource = $sourceKey; @endphp
                                <tr class="classroom-band">
                                    <td colspan="5">
                                        <div style="display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;">
                                            <span>{{ $source->name }} | {{ $source->students->count() }} คน</span>
                                            <label style="display:flex;gap:8px;align-items:center;font-weight:500;">
                                                <span class="helper">ตั้งทั้งห้องเป็น</span>
                                                <select class="row-select bulk-target" data-source="{{ $source->id }}">
                                                    <option value="">จบการศึกษา</option>
                                                    @foreach ($targetClassrooms as $classroom)
                                                        <option value="{{ $classroom->id }}"> {{ $classroom->name }} </option>
                                                    @endforeach
                                                </select>
                                            </label>
                                        </div>
                                    </td>
                                </tr>
                            @endif

                            <tr>
                                <td>{{ $row['student_number'] ?? '-' }}</td>
                                <td>
                                    <strong>{{ $student->full_name }}</strong>
                                    <div class="helper">{{ $student->student_code }}</div>
                                    <input type="hidden" name="assignments[{{ $index }}][student_id]" value="{{ $student->id }}">
                                    <input type="hidden" name="assignments[{{ $index }}][source_classroom_id]" value="{{ $source->id }}">
                                </td>
                                <td>{{ $source->name }}</td>
                                <td>
                                    <select class="row-select target-select" data-source="{{ $source->id }}" name="assignments[{{ $index }}][target_classroom_id]">
                                        <option value="">จบการศึกษา</option>
                                        @foreach ($targetClassrooms as $classroom)
                                            <option value="{{ $classroom->id }}" @selected($row['suggested_classroom_id'] === $classroom->id)>
                                                {{ $classroom->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </td>
                                <td>
                                    <input class="number-input" type="number" min="1" max="999" name="assignments[{{ $index }}][student_number]" value="{{ $row['student_number'] }}">
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="5">ไม่พบนักเรียนในปี/เทอมต้นทาง</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            @if ($rows->isNotEmpty())
                <div class="save-bar">
                    <button class="btn" type="submit">บันทึกการจัดห้อง</button>
                </div>
            @endif
        </form>

        <script>
            document.querySelectorAll('.bulk-target').forEach((select) => {
                select.addEventListener('change', () => {
                    document.querySelectorAll('.target-select[data-source="' + select.dataset.source + '"]').forEach((target) => {
                        target.value = select.value;
                    });
                });
            });
        </script>
    @else
        <div class="card">
            <strong>เริ่มจากเลือกปี/เทอม</strong>
            <p class="page-subtitle" style="margin-top:6px;">ถ้ายังไม่มีปี/เทอมปลายทางหรือห้องปลายทาง ให้สร้างจากเมนูปีการศึกษาและห้องเรียนก่อน</p>
        </div>
    @endif
@endsection