// 📋 선생님용 "스마트기기 반출 대장" 화면 (UI 전용). 오늘 신청된 반출 요청을 보여주고 승인/거절한다.
// 서버 통신/상태는 lib/function/device_checkout_ledger_controller.dart가 담당한다.
import 'package:flutter/material.dart';
import '../function/device_checkout_ledger_controller.dart';
import '../theme/app_palette.dart';
import 'app_notice.dart';
import 'title_pill.dart';

class DeviceCheckoutLedgerPage extends StatefulWidget {
  final String? teacherId;
  final String? teacherName;

  const DeviceCheckoutLedgerPage({super.key, this.teacherId, this.teacherName});

  @override
  State<DeviceCheckoutLedgerPage> createState() =>
      _DeviceCheckoutLedgerPageState();
}

class _DeviceCheckoutLedgerPageState extends State<DeviceCheckoutLedgerPage> {
  final DeviceCheckoutLedgerController _controller =
      DeviceCheckoutLedgerController();

  @override
  void initState() {
    super.initState();
    _controller.init();
  }

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

  Future<void> _approve(int id) async {
    final (_, message) = await _controller.approve(
      id,
      teacherId: widget.teacherId ?? '간편인증',
      teacherName: widget.teacherName ?? '간편인증 선생',
    );
    if (!mounted) return;
    AppNotice.show(context, message);
  }

  Future<void> _reject(int id) async {
    final (_, message) = await _controller.reject(id);
    if (!mounted) return;
    AppNotice.show(context, message);
  }

  // 🖐️ [하드웨어 자동 감지 전까지 임시] 기기를 실제로 돌려받았을 때 누르는 버튼.
  Future<void> _confirmReturn(int id) async {
    final (_, message) = await _controller.confirmReturn(id);
    if (!mounted) return;
    AppNotice.show(context, message);
  }

  ({Color color, String label}) _statusInfo(String status) {
    switch (status) {
      case 'PENDING':
        return (color: Colors.orange, label: '대기중');
      case 'APPROVED':
        return (color: Colors.blue, label: '승인됨');
      case 'RETURNED':
        return (color: Colors.grey, label: '반납완료');
      case 'REJECTED':
        return (color: Colors.red, label: '거절됨');
      default:
        return (color: Colors.grey, label: status);
    }
  }

  String _timeRange(String start, String end) {
    // "YYYY-MM-DD HH:MM:SS" -> "HH:MM"
    String hm(String full) => full.length >= 16 ? full.substring(11, 16) : full;
    return '${hm(start)} ~ ${hm(end)}';
  }

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: _controller,
      builder: (context, _) {
        final requests = _controller.requests;
        final pendingCount = requests
            .where((r) => r['status'] == 'PENDING')
            .length;

        return Scaffold(
          backgroundColor: AppPalette.mist,
          appBar: AppBar(
            backgroundColor: Colors.transparent,
            foregroundColor: AppPalette.ink,
            elevation: 0,
            centerTitle: true,
            title: const TitlePill(
              child: Text(
                '스마트기기 반출 대장',
                style: TextStyle(
                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                ),
              ),
            ),
            actions: [
              IconButton(
                icon: const Icon(Icons.refresh_rounded),
                onPressed: _controller.fetchAll,
                tooltip: '새로고침',
              ),
            ],
          ),
          body: _controller.isLoading
              ? const Center(child: CircularProgressIndicator())
              : Column(
                  children: [
                    if (pendingCount > 0)
                      Container(
                        width: double.infinity,
                        margin: const EdgeInsets.all(16),
                        padding: const EdgeInsets.symmetric(
                          horizontal: 16,
                          vertical: 10,
                        ),
                        decoration: BoxDecoration(
                          color: Colors.orange[100],
                          borderRadius: BorderRadius.circular(12),
                          border: Border.all(color: Colors.orange[400]!),
                        ),
                        child: Text(
                          '승인 대기 중인 요청이 $pendingCount건 있습니다.',
                          style: TextStyle(
                            color: Colors.orange[900],
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                    Expanded(
                      child: requests.isEmpty
                          ? const Center(
                              child: Text(
                                '오늘 신청된 반출 요청이 없습니다.',
                                style: TextStyle(color: Colors.grey),
                              ),
                            )
                          : ListView.builder(
                              padding: const EdgeInsets.symmetric(
                                horizontal: 16,
                                vertical: 8,
                              ),
                              itemCount: requests.length,
                              itemBuilder: (context, index) {
                                final r = requests[index];
                                final String status = r['status'];
                                final info = _statusInfo(status);
                                final bool isPending = status == 'PENDING';

                                return Card(
                                  elevation: 0,
                                  color: AppPalette.paper,
                                  margin: const EdgeInsets.only(bottom: 10),
                                  shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(16),
                                    side: isPending
                                        ? BorderSide(color: Colors.orange[300]!)
                                        : BorderSide(color: AppPalette.sage),
                                  ),
                                  child: Padding(
                                    padding: const EdgeInsets.all(16),
                                    child: Column(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: [
                                        Row(
                                          children: [
                                            Expanded(
                                              child: Text(
                                                '${r['studentName']} (${r['studentId']})',
                                                style: const TextStyle(
                                                  fontWeight: FontWeight.bold,
                                                  fontSize: 15,
                                                ),
                                              ),
                                            ),
                                            Container(
                                              padding:
                                                  const EdgeInsets.symmetric(
                                                    horizontal: 10,
                                                    vertical: 4,
                                                  ),
                                              decoration: BoxDecoration(
                                                color: info.color.withValues(
                                                  alpha: 0.12,
                                                ),
                                                borderRadius:
                                                    BorderRadius.circular(20),
                                              ),
                                              child: Text(
                                                info.label,
                                                style: TextStyle(
                                                  color: info.color,
                                                  fontWeight: FontWeight.bold,
                                                  fontSize: 12,
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                        const SizedBox(height: 6),
                                        Text(
                                          _timeRange(
                                            r['requestedStart'],
                                            r['requestedEnd'],
                                          ),
                                          style: TextStyle(
                                            color: Colors.grey[700],
                                            fontSize: 13,
                                          ),
                                        ),
                                        const SizedBox(height: 2),
                                        Text(
                                          r['purpose'],
                                          style: TextStyle(
                                            color: Colors.grey[700],
                                            fontSize: 13,
                                          ),
                                        ),
                                        if (status == 'APPROVED' &&
                                            r['approvedByTeacherName'] !=
                                                null) ...[
                                          const SizedBox(height: 2),
                                          Text(
                                            '${r['approvedByTeacherName']} 선생님이 허용했습니다',
                                            style: TextStyle(
                                              color: Colors.blue[700],
                                              fontSize: 12,
                                              fontWeight: FontWeight.w600,
                                            ),
                                          ),
                                        ],
                                        if (isPending) ...[
                                          const SizedBox(height: 12),
                                          Row(
                                            children: [
                                              Expanded(
                                                child: OutlinedButton(
                                                  onPressed:
                                                      _controller.isWorking
                                                      ? null
                                                      : () => _reject(r['id']),
                                                  style:
                                                      OutlinedButton.styleFrom(
                                                        foregroundColor:
                                                            Colors.red,
                                                        side: const BorderSide(
                                                          color: Colors.red,
                                                        ),
                                                      ),
                                                  child: const Text('거절'),
                                                ),
                                              ),
                                              const SizedBox(width: 8),
                                              Expanded(
                                                child: ElevatedButton(
                                                  onPressed:
                                                      _controller.isWorking
                                                      ? null
                                                      : () => _approve(r['id']),
                                                  style:
                                                      ElevatedButton.styleFrom(
                                                        backgroundColor:
                                                            AppPalette.ink,
                                                        foregroundColor:
                                                            AppPalette.paper,
                                                      ),
                                                  child: const Text('승인'),
                                                ),
                                              ),
                                            ],
                                          ),
                                        ],
                                        if (status == 'APPROVED') ...[
                                          const SizedBox(height: 12),
                                          SizedBox(
                                            width: double.infinity,
                                            child: OutlinedButton.icon(
                                              onPressed: _controller.isWorking
                                                  ? null
                                                  : () =>
                                                        _confirmReturn(r['id']),
                                              style: OutlinedButton.styleFrom(
                                                foregroundColor:
                                                    Colors.grey[800],
                                                side: BorderSide(
                                                  color: Colors.grey[400]!,
                                                ),
                                              ),
                                              icon: const Icon(
                                                Icons
                                                    .assignment_turned_in_outlined,
                                                size: 18,
                                              ),
                                              label: const Text('기기 반납 확인'),
                                            ),
                                          ),
                                        ],
                                      ],
                                    ),
                                  ),
                                );
                              },
                            ),
                    ),
                  ],
                ),
        );
      },
    );
  }
}