import 'package:flutter/material.dart';
import 'package:superport/screens/common/layout_components.dart';
import 'package:superport/screens/common/main_layout.dart';
import 'package:superport/screens/common/theme_tailwind.dart';
import 'package:superport/services/mock_data_service.dart';
import 'package:superport/utils/constants.dart';
import 'package:superport/screens/overview/controllers/overview_controller.dart';
import 'package:superport/screens/overview/widgets/stats_grid.dart';
import 'package:superport/screens/overview/widgets/recent_activities_list.dart';

// 대시보드(Overview) 화면 (UI만 담당, 상태/로직/위젯 분리)
class OverviewScreen extends StatefulWidget {
  const OverviewScreen({Key? key}) : super(key: key);

  @override
  _OverviewScreenState createState() => _OverviewScreenState();
}

class _OverviewScreenState extends State<OverviewScreen> {
  late final OverviewController _controller;

  @override
  void initState() {
    super.initState();
    _controller = OverviewController(dataService: MockDataService());
    _controller.loadData();
  }

  void _reload() {
    setState(() {
      _controller.loadData();
    });
  }

  @override
  Widget build(BuildContext context) {
    // 전체 배경색을 회색(AppThemeTailwind.surface)으로 지정
    return Container(
      color: AppThemeTailwind.surface, // 회색 배경
      child: MainLayout(
        title: '', // 타이틀 없음
        currentRoute: Routes.home,
        actions: [
          IconButton(
            icon: const Icon(Icons.refresh),
            onPressed: _reload,
            color: AppThemeTailwind.muted,
          ),
          IconButton(
            icon: const Icon(Icons.notifications_none),
            onPressed: () {},
            color: AppThemeTailwind.muted,
          ),
          IconButton(
            icon: const Icon(Icons.logout),
            tooltip: '로그아웃',
            onPressed: () {
              Navigator.of(context).pushReplacementNamed('/login');
            },
            color: AppThemeTailwind.muted,
          ),
        ],
        child: SingleChildScrollView(
          padding: EdgeInsets.zero, // 여백 0
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // 상단 경로 표기 완전 삭제
              // 하단부 전체를 감싸는 라운드 흰색 박스
              Container(
                margin: const EdgeInsets.all(4), // 외부 여백만 적용
                decoration: BoxDecoration(
                  color: Colors.white, // 흰색 배경
                  borderRadius: BorderRadius.circular(24), // 라운드 처리
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withOpacity(0.04),
                      blurRadius: 12,
                      offset: const Offset(0, 4),
                    ),
                  ],
                ),
                padding: const EdgeInsets.all(32), // 내부 여백 유지
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    // 통계 카드 그리드
                    Container(
                      margin: const EdgeInsets.only(bottom: 32),
                      child: StatsGrid(
                        totalCompanies: _controller.totalCompanies,
                        totalUsers: _controller.totalUsers,
                        totalLicenses: _controller.totalLicenses,
                        totalEquipmentIn: _controller.totalEquipmentIn,
                        totalEquipmentOut: _controller.totalEquipmentOut,
                      ),
                    ),
                    _buildActivitySection(),
                    const SizedBox(height: 32),
                    _buildRecentItemsSection(),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildActivitySection() {
    // MetronicCard로 감싸고, 섹션 헤더 스타일 통일
    return MetronicCard(
      title: '시스템 활동',
      margin: const EdgeInsets.only(bottom: 32),
      child: Column(
        children: [
          _buildActivityChart(),
          const SizedBox(height: 20),
          const Divider(color: Color(0xFFF3F6F9)),
          const SizedBox(height: 20),
          _buildActivityLegend(),
        ],
      ),
    );
  }

  Widget _buildActivityChart() {
    // Metronic 스타일: 카드 내부 차트 영역, 라운드, 밝은 배경, 컬러 강조
    return Container(
      height: 200,
      padding: const EdgeInsets.all(24),
      decoration: BoxDecoration(
        color: AppThemeTailwind.light,
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          const Icon(
            Icons.bar_chart,
            size: 56,
            color: AppThemeTailwind.primary,
          ),
          const SizedBox(height: 18),
          Text('월별 장비 입/출고 추이', style: AppThemeTailwind.subheadingStyle),
          const SizedBox(height: 10),
          Text(
            '실제 구현 시 차트 라이브러리 (fl_chart 등) 사용',
            style: AppThemeTailwind.smallText,
          ),
        ],
      ),
    );
  }

  Widget _buildActivityLegend() {
    // Metronic 스타일: 라운드, 컬러, 폰트 통일
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        _buildLegendItem('장비 입고', AppThemeTailwind.success),
        const SizedBox(width: 32),
        _buildLegendItem('장비 출고', AppThemeTailwind.warning),
        const SizedBox(width: 32),
        _buildLegendItem('라이센스 등록', AppThemeTailwind.info),
      ],
    );
  }

  Widget _buildLegendItem(String text, Color color) {
    // Metronic 스타일: 컬러 원, 텍스트, 여백
    return Row(
      children: [
        Container(
          width: 14,
          height: 14,
          decoration: BoxDecoration(color: color, shape: BoxShape.circle),
        ),
        const SizedBox(width: 10),
        Text(
          text,
          style: AppThemeTailwind.smallText.copyWith(
            fontWeight: FontWeight.w600,
            color: AppThemeTailwind.dark,
          ),
        ),
      ],
    );
  }

  Widget _buildRecentItemsSection() {
    // Metronic 스타일: 카드, 섹션 헤더, 리스트 여백/컬러 통일
    return MetronicCard(
      title: '최근 활동',
      child: Column(
        children: [
          const Divider(indent: 0, endIndent: 0, color: Color(0xFFF3F6F9)),
          const SizedBox(height: 16),
          RecentActivitiesList(recentActivities: _controller.recentActivities),
          const SizedBox(height: 8),
        ],
      ),
    );
  }
}