import 'package:flutter/material.dart';
import '../../core/constants/app_text_styles.dart';
import '../widgets/teacher_panel_scaffold.dart';
import 'course_page.dart';
import 'dashboard_page.dart';
import 'license_page.dart';
import 'ticket_page.dart';

class TransactionPage extends StatelessWidget {
  const TransactionPage({super.key});

  @override
  Widget build(BuildContext context) {
    final isDesktop = MediaQuery.of(context).size.width > 900;
    final rows = List.generate(9, (_) => _TransactionRowData(
          description: 'افزایش اعتبار',
          debit: '۱۲۰۰۰۰ تومان',
          credit: '۳۴۰۰۰۰۰ تومان',
          date: '۱۴۰۴/۱۰/۰۱',
        ));

    return TeacherPanelScaffold(
      selectedMenu: PanelMenu.transaction,
      onDashboardTap: () {
        Navigator.of(context).pushReplacement(
          MaterialPageRoute(builder: (context) => const DashboardPage()),
        );
      },
      onCourseTap: () {
        Navigator.of(context).pushReplacement(
          MaterialPageRoute(builder: (context) => const CoursePage()),
        );
      },
      onLicenseTap: () {
        Navigator.of(context).pushReplacement(
          MaterialPageRoute(builder: (context) => const PanelLicensePage()),
        );
      },
      onTransactionTap: () {},
      onTicketTap: () {
        Navigator.of(context).pushReplacement(
          MaterialPageRoute(builder: (context) => const TicketPage()),
        );
      },
      child: Padding(
        padding: EdgeInsets.all(isDesktop ? 24 : 12),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white.withValues(alpha: 0.35),
            borderRadius: BorderRadius.circular(10),
          ),
          child: Column(
            children: [
              Padding(
                padding: EdgeInsets.all(isDesktop ? 14 : 10),
                child: Column(
                  children: [
                    Wrap(
                      spacing: 8,
                      runSpacing: 8,
                      children: [
                        SizedBox(
                          width: isDesktop ? 245 : double.infinity,
                          height: 36,
                          child: TextField(
                            decoration: InputDecoration(
                              hintText: 'جست و جو',
                              prefixIcon: const Icon(Icons.search, size: 18),
                              border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(6),
                                borderSide: BorderSide(color: Colors.grey.shade400),
                              ),
                              contentPadding: const EdgeInsets.symmetric(vertical: 8),
                            ),
                          ),
                        ),
                        SizedBox(
                          width: isDesktop ? 245 : double.infinity,
                          height: 36,
                          child: DropdownButtonFormField<String>(
                            initialValue: 'تاریخ ایجاد',
                            isExpanded: true,
                            decoration: InputDecoration(
                              border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(6),
                                borderSide: BorderSide(color: Colors.grey.shade400),
                              ),
                              contentPadding: const EdgeInsets.symmetric(
                                horizontal: 10,
                                vertical: 6,
                              ),
                            ),
                            items: const [
                              DropdownMenuItem(value: 'تاریخ ایجاد', child: Text('تاریخ ایجاد')),
                              DropdownMenuItem(value: 'جدیدترین', child: Text('جدیدترین')),
                            ],
                            onChanged: (_) {},
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
              Expanded(
                child: Container(
                  margin: EdgeInsets.fromLTRB(
                    isDesktop ? 14 : 8,
                    0,
                    isDesktop ? 14 : 8,
                    isDesktop ? 14 : 8,
                  ),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    border: Border.all(color: Colors.black12),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: Column(
                    children: [
                      Container(
                        height: 46,
                        decoration: const BoxDecoration(
                          color: Color(0xFFD5D5D5),
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(8),
                            topRight: Radius.circular(8),
                          ),
                        ),
                        child: const Row(
                          children: [
                            _HeaderCell(title: 'توضیحات', flex: 3),
                            _HeaderCell(title: 'برداشت', flex: 3),
                            _HeaderCell(title: 'اعتبار', flex: 3),
                            _HeaderCell(title: 'تاریخ', flex: 2),
                          ],
                        ),
                      ),
                      Expanded(
                        child: ListView.separated(
                          itemCount: rows.length,
                          separatorBuilder: (_, index) =>
                              const Divider(height: 1, color: Color(0xFFE1E1E1)),
                          itemBuilder: (context, index) {
                            final item = rows[index];
                            return SizedBox(
                              height: 48,
                              child: Row(
                                children: [
                                  _BodyCell(text: item.description, flex: 3),
                                  _BodyCell(text: item.debit, flex: 3),
                                  _BodyCell(text: item.credit, flex: 3),
                                  _BodyCell(text: item.date, flex: 2),
                                ],
                              ),
                            );
                          },
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class _HeaderCell extends StatelessWidget {
  final String title;
  final int flex;

  const _HeaderCell({required this.title, required this.flex});

  @override
  Widget build(BuildContext context) {
    return Expanded(
      flex: flex,
      child: Center(
        child: Text(
          title,
          style: AppTextStyles.bodyLarge.copyWith(fontWeight: FontWeight.w700),
        ),
      ),
    );
  }
}

class _BodyCell extends StatelessWidget {
  final String text;
  final int flex;

  const _BodyCell({required this.text, required this.flex});

  @override
  Widget build(BuildContext context) {
    return Expanded(
      flex: flex,
      child: Center(
        child: Text(text, style: AppTextStyles.bodyLarge),
      ),
    );
  }
}

class _TransactionRowData {
  final String description;
  final String debit;
  final String credit;
  final String date;

  const _TransactionRowData({
    required this.description,
    required this.debit,
    required this.credit,
    required this.date,
  });
}