// 📍 선생님 호출 화면(학생용) (UI 전용). 선생님을 골라 방문 목적과 함께 호출한다.
// 서버 통신/상태는 lib/function/teacher_call_controller.dart가 담당한다.
import 'package:flutter/material.dart';
import '../data/teacher_call_schedule.dart';
import '../function/teacher_call_controller.dart';
import '../theme/app_palette.dart';
import 'app_notice.dart';
import 'title_pill.dart';

class TeacherCallScreen extends StatefulWidget {
  final String studentId;
  final String studentName;

  const TeacherCallScreen({
    super.key,
    required this.studentId,
    required this.studentName,
  });

  @override
  State<TeacherCallScreen> createState() => _TeacherCallScreenState();
}

class _TeacherCallScreenState extends State<TeacherCallScreen> {
  late final TeacherCallController _controller;
  String? _selectedTeacherId;
  String? _selectedTeacherName;
  String _selectedPurpose = kCallPurposes.first;
  final _customPurposeController = TextEditingController();
  bool _useCustomPurpose = false;

  @override
  void initState() {
    super.initState();
    _controller = TeacherCallController(
      studentId: widget.studentId,
      studentName: widget.studentName,
    );
    _controller.init();
  }

  @override
  void dispose() {
    _controller.dispose();
    _customPurposeController.dispose();
    super.dispose();
  }

  Future<void> _call() async {
    if (_selectedTeacherId == null) {
      AppNotice.show(context, '선생님을 선택해 주세요.');
      return;
    }
    final purpose = _useCustomPurpose
        ? _customPurposeController.text.trim()
        : _selectedPurpose;
    if (purpose.isEmpty) {
      AppNotice.show(context, '방문 목적을 입력해 주세요.');
      return;
    }
    final (success, message) = await _controller.callTeacher(
      teacherId: _selectedTeacherId!,
      purpose: purpose,
    );
    if (!mounted) return;
    AppNotice.show(
      context,
      message,
      icon: success ? Icons.check_circle_rounded : Icons.error_outline_rounded,
    );
  }

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: _controller,
      builder: (context, _) {
        return Scaffold(
          backgroundColor: AppPalette.mist,
          appBar: AppBar(
            backgroundColor: Colors.transparent,
            foregroundColor: AppPalette.ink,
            elevation: 0,
            centerTitle: true,
            title: const TitlePill('선생님 호출'),
          ),
          body: _controller.isLoading
              ? const Center(child: CircularProgressIndicator())
              : RefreshIndicator(
                  onRefresh: _controller.refresh,
                  child: ListView(
                    padding: const EdgeInsets.all(16),
                    children: [
                      if (_controller.ranking.isNotEmpty) _buildRanking(),
                      const SizedBox(height: 16),
                      const Text(
                        '방문 목적',
                        style: TextStyle(fontWeight: FontWeight.bold),
                      ),
                      const SizedBox(height: 8),
                      _buildPurposeChips(),
                      if (_useCustomPurpose) ...[
                        const SizedBox(height: 8),
                        TextField(
                          controller: _customPurposeController,
                          maxLength: 40,
                          decoration: InputDecoration(
                            hintText: '용무를 입력하세요',
                            filled: true,
                            fillColor: AppPalette.paper,
                            border: OutlineInputBorder(
                              borderRadius: BorderRadius.circular(12),
                              borderSide: BorderSide(color: AppPalette.sage),
                            ),
                          ),
                        ),
                      ],
                      const SizedBox(height: 16),
                      const Text(
                        '선생님 선택',
                        style: TextStyle(fontWeight: FontWeight.bold),
                      ),
                      const SizedBox(height: 8),
                      _buildTeacherGrid(),
                      const SizedBox(height: 20),
                      SizedBox(
                        width: double.infinity,
                        child: ElevatedButton(
                          style: ElevatedButton.styleFrom(
                            backgroundColor: _selectedTeacherId == null
                                ? Colors.grey
                                : AppPalette.ink,
                            foregroundColor: AppPalette.paper,
                            padding: const EdgeInsets.symmetric(vertical: 16),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(14),
                            ),
                          ),
                          onPressed: _controller.isCalling ? null : _call,
                          child: _controller.isCalling
                              ? const SizedBox(
                                  width: 20,
                                  height: 20,
                                  child: CircularProgressIndicator(
                                    strokeWidth: 2,
                                    color: Colors.white,
                                  ),
                                )
                              : Text(
                                  _selectedTeacherName == null
                                      ? '선생님을 선택해 주세요'
                                      : '$_selectedTeacherName 선생님 호출하기',
                                  style: const TextStyle(
                                    fontWeight: FontWeight.bold,
                                  ),
                                ),
                        ),
                      ),
                      const SizedBox(height: 24),
                      const Text(
                        '내 호출 기록',
                        style: TextStyle(fontWeight: FontWeight.bold),
                      ),
                      const SizedBox(height: 8),
                      _buildMyCalls(),
                    ],
                  ),
                ),
        );
      },
    );
  }

  Widget _buildRanking() {
    final medals = ['🥇', '🥈', '🥉'];
    return Container(
      padding: const EdgeInsets.all(14),
      decoration: BoxDecoration(
        color: AppPalette.paper,
        borderRadius: BorderRadius.circular(16),
        border: Border.all(color: AppPalette.sage),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            '오늘 인기 선생님',
            style: TextStyle(fontWeight: FontWeight.bold, color: Colors.grey),
          ),
          const SizedBox(height: 8),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              for (var i = 0; i < _controller.ranking.length; i++)
                Column(
                  children: [
                    Text(medals[i], style: const TextStyle(fontSize: 22)),
                    Text(
                      _controller.ranking[i]['teacherName'] ?? '',
                      style: const TextStyle(fontWeight: FontWeight.bold),
                    ),
                    Text(
                      '${_controller.ranking[i]['count']}회',
                      style: const TextStyle(color: Colors.grey, fontSize: 12),
                    ),
                  ],
                ),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildPurposeChips() {
    return Wrap(
      spacing: 8,
      runSpacing: 8,
      children: [
        for (final p in kCallPurposes)
          ChoiceChip(
            label: Text(p),
            selected: !_useCustomPurpose && _selectedPurpose == p,
            onSelected: (_) => setState(() {
              _useCustomPurpose = false;
              _selectedPurpose = p;
            }),
            selectedColor: AppPalette.ink,
            labelStyle: TextStyle(
              color: !_useCustomPurpose && _selectedPurpose == p
                  ? Colors.white
                  : AppPalette.ink,
            ),
          ),
        ChoiceChip(
          label: const Text('직접 입력'),
          selected: _useCustomPurpose,
          onSelected: (_) => setState(() => _useCustomPurpose = true),
          selectedColor: AppPalette.ink,
          labelStyle: TextStyle(
            color: _useCustomPurpose ? Colors.white : AppPalette.ink,
          ),
        ),
      ],
    );
  }

  Widget _buildTeacherGrid() {
    return GridView.builder(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        childAspectRatio: 1,
        crossAxisSpacing: 10,
        mainAxisSpacing: 10,
      ),
      itemCount: _controller.teachers.length,
      itemBuilder: (context, index) {
        final t = _controller.teachers[index];
        final name = t['name'] ?? '';
        final location = t['location'] ?? '교무실';
        final isSelected = _selectedTeacherId == t['teacherId'];
        final inClass = _controller.isInClassNow(name);
        return GestureDetector(
          onTap: () => setState(() {
            _selectedTeacherId = t['teacherId'];
            _selectedTeacherName = name;
          }),
          child: Container(
            decoration: BoxDecoration(
              color: isSelected ? const Color(0xFFEFF6FF) : AppPalette.paper,
              borderRadius: BorderRadius.circular(12),
              border: Border.all(
                color: isSelected ? AppPalette.ink : AppPalette.sage,
                width: isSelected ? 2 : 1,
              ),
            ),
            child: Stack(
              children: [
                Center(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        name,
                        style: const TextStyle(fontWeight: FontWeight.bold),
                      ),
                      const SizedBox(height: 4),
                      Text(
                        '${kLocationIcons[location] ?? '📍'} $location',
                        style: const TextStyle(
                          fontSize: 11,
                          color: Colors.grey,
                        ),
                      ),
                    ],
                  ),
                ),
                if (inClass)
                  Positioned(
                    top: 4,
                    right: 4,
                    child: Container(
                      padding: const EdgeInsets.symmetric(
                        horizontal: 4,
                        vertical: 1,
                      ),
                      decoration: BoxDecoration(
                        color: Colors.orange[100],
                        borderRadius: BorderRadius.circular(4),
                        border: Border.all(color: Colors.orange),
                      ),
                      child: const Text(
                        '수업중',
                        style: TextStyle(fontSize: 9, color: Colors.orange),
                      ),
                    ),
                  ),
              ],
            ),
          ),
        );
      },
    );
  }

  Widget _buildMyCalls() {
    if (_controller.myCalls.isEmpty) {
      return const Padding(
        padding: EdgeInsets.symmetric(vertical: 12),
        child: Text('아직 호출 기록이 없어요.', style: TextStyle(color: Colors.grey)),
      );
    }
    return Column(
      children: [
        for (final c in _controller.myCalls)
          Container(
            margin: const EdgeInsets.only(bottom: 8),
            padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
            decoration: BoxDecoration(
              color: AppPalette.paper,
              borderRadius: BorderRadius.circular(12),
            ),
            child: Row(
              children: [
                Expanded(
                  child: Text('${c['teacherName']} 선생님 · ${c['purpose']}'),
                ),
                Text(
                  '${c['createdAt'] ?? ''}'.split(' ').last,
                  style: const TextStyle(color: Colors.grey, fontSize: 12),
                ),
              ],
            ),
          ),
      ],
    );
  }
}