import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../../../common/theme/theme.dart';
import '../../draw_page.dart';

// Prize model
class Prize {
  final String id;
  final String name;
  final String value;
  final String icon;
  final int quantity;
  final String description;

  Prize({
    required this.id,
    required this.name,
    required this.value,
    required this.icon,
    required this.quantity,
    required this.description,
  });
}

// Voucher model
class UserVoucher {
  final String id;
  final String drawId;
  final String voucherNumber;
  final DateTime createdDate;
  final String status; // 'active', 'used', 'expired'

  UserVoucher({
    required this.id,
    required this.drawId,
    required this.voucherNumber,
    required this.createdDate,
    required this.status,
  });
}

@RoutePage()
class DrawDetailPage extends StatefulWidget {
  final DrawEvent drawEvent;

  const DrawDetailPage({super.key, required this.drawEvent});

  @override
  State<DrawDetailPage> createState() => _DrawDetailPageState();
}

class _DrawDetailPageState extends State<DrawDetailPage>
    with TickerProviderStateMixin {
  late TabController _tabController;

  // Sample data
  final List<Prize> prizes = [
    Prize(
      id: "1",
      name: "Emas 3 Gram",
      value: "Rp 2.500.000",
      icon: "👑",
      quantity: 1,
      description:
          "Emas murni 24 karat seberat 3 gram dari toko emas terpercaya",
    ),
    Prize(
      id: "2",
      name: "Emas 1 Gram",
      value: "Rp 850.000",
      icon: "🥇",
      quantity: 1,
      description:
          "Emas murni 24 karat seberat 1 gram dari toko emas terpercaya",
    ),
  ];

  final List<UserVoucher> userVouchers = [
    UserVoucher(
      id: "1",
      drawId: "1",
      voucherNumber: "ENK001234567",
      createdDate: DateTime.now().subtract(Duration(hours: 2)),
      status: 'active',
    ),
  ];

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 4, vsync: this);
  }

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

  String _getTimeRemaining(DateTime targetDate) {
    final now = DateTime.now();
    final difference = targetDate.difference(now);

    if (difference.isNegative) return "Sudah berakhir";

    if (difference.inDays > 0) {
      return "${difference.inDays} hari ${difference.inHours % 24} jam";
    } else if (difference.inHours > 0) {
      return "${difference.inHours} jam ${difference.inMinutes % 60} menit";
    } else if (difference.inMinutes > 0) {
      return "${difference.inMinutes} menit";
    } else {
      return "Berakhir sekarang!";
    }
  }

  String _formatCurrency(int amount) {
    return amount.toString().replaceAllMapped(
      RegExp(r'(\d{1,3})(?=(\d{3})+(?!\d))'),
      (Match m) => '${m[1]}.',
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColor.background,
      body: CustomScrollView(
        slivers: [
          // App Bar with gradient
          SliverAppBar(
            expandedHeight: 200,
            pinned: true,
            backgroundColor: widget.drawEvent.primaryColor,
            leading: IconButton(
              icon: Icon(Icons.arrow_back, color: AppColor.textWhite),
              onPressed: () => Navigator.of(context).pop(),
            ),
            flexibleSpace: FlexibleSpaceBar(
              background: Container(
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                    colors: [
                      widget.drawEvent.primaryColor,
                      widget.drawEvent.primaryColor.withOpacity(0.8),
                    ],
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                  ),
                ),
                child: Stack(
                  children: [
                    // Background decoration
                    Positioned(
                      right: 20,
                      top: 60,
                      child: Opacity(
                        opacity: 0.2,
                        child: Column(
                          children: [
                            Row(
                              children: [
                                _buildCoin(),
                                SizedBox(width: 8),
                                _buildCoin(),
                                SizedBox(width: 8),
                                _buildCoin(),
                              ],
                            ),
                            SizedBox(height: 12),
                            _buildGoldBar(),
                          ],
                        ),
                      ),
                    ),

                    // Content
                    Padding(
                      padding: EdgeInsets.only(left: 20, right: 20, top: 100),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          if (widget.drawEvent.isActive)
                            Container(
                              padding: EdgeInsets.symmetric(
                                horizontal: 12,
                                vertical: 6,
                              ),
                              decoration: BoxDecoration(
                                color: AppColor.success,
                                borderRadius: BorderRadius.circular(20),
                              ),
                              child: Text(
                                "UNDIAN AKTIF",
                                style: AppStyle.xs.copyWith(
                                  color: AppColor.textWhite,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ),
                          SizedBox(height: 8),
                          Text(
                            widget.drawEvent.name,
                            style: AppStyle.h3.copyWith(
                              color: AppColor.textWhite,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                          Text(
                            widget.drawEvent.description.split('\n').first,
                            style: AppStyle.md.copyWith(
                              color: AppColor.textWhite.withOpacity(0.9),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),

          // Tab Bar
          SliverPersistentHeader(
            pinned: true,
            delegate: _SliverTabBarDelegate(
              TabBar(
                controller: _tabController,
                labelColor: AppColor.primary,
                unselectedLabelColor: AppColor.textSecondary,
                indicatorColor: AppColor.primary,
                indicatorWeight: 3,
                labelStyle: AppStyle.md.copyWith(fontWeight: FontWeight.w600),
                unselectedLabelStyle: AppStyle.md,
                tabs: [
                  Tab(text: "Info"),
                  Tab(text: "Hadiah"),
                  Tab(text: "Voucher"),
                  Tab(text: "S&K"),
                ],
              ),
            ),
          ),

          // Tab Content
          SliverFillRemaining(
            child: TabBarView(
              controller: _tabController,
              children: [
                _buildInfoTab(),
                _buildPrizesTab(),
                _buildVouchersTab(),
                _buildTermsTab(),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildInfoTab() {
    final timeRemaining = _getTimeRemaining(widget.drawEvent.drawDate);

    return SingleChildScrollView(
      padding: EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildInfoCard(
            title: "Informasi Undian",
            children: [
              _buildInfoRow("Nama Undian", widget.drawEvent.name),
              _buildInfoRow("Deskripsi", widget.drawEvent.description),
              _buildInfoRow(
                "Total Hadiah",
                "${widget.drawEvent.hadiah} hadiah",
              ),
              _buildInfoRow("Nilai Hadiah", widget.drawEvent.prizeValue),
              _buildInfoRow(
                "Status",
                widget.drawEvent.isActive ? "Aktif" : "Selesai",
              ),
            ],
          ),

          SizedBox(height: 16),

          _buildInfoCard(
            title: "Waktu Undian",
            children: [
              _buildInfoRow(
                "Tanggal Pengundian",
                _formatDateTime(widget.drawEvent.drawDate),
              ),
              _buildInfoRow("Waktu Tersisa", timeRemaining),
            ],
          ),

          SizedBox(height: 16),

          _buildInfoCard(
            title: "Statistik",
            children: [
              _buildInfoRow(
                "Total Peserta",
                "${widget.drawEvent.totalParticipants} orang",
              ),
              _buildInfoRow(
                "Voucher Anda",
                "${userVouchers.where((v) => v.drawId == widget.drawEvent.id).length}",
              ),
              _buildInfoRow(
                "Minimum Belanja",
                "Rp ${_formatCurrency(widget.drawEvent.minSpending)}",
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildPrizesTab() {
    return SingleChildScrollView(
      padding: EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Daftar Hadiah",
            style: AppStyle.lg.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.textPrimary,
            ),
          ),
          SizedBox(height: 16),

          ...prizes.map((prize) => _buildPrizeCard(prize)).toList(),

          SizedBox(height: 16),

          _buildInfoCard(
            title: "Ketentuan Hadiah",
            children: [
              _buildBulletPoint(
                "Hadiah akan diumumkan setelah pengundian selesai",
              ),
              _buildBulletPoint(
                "Pemenang akan dihubungi melalui nomor telepon terdaftar",
              ),
              _buildBulletPoint("Hadiah harus diambil dalam waktu 30 hari"),
              _buildBulletPoint(
                "Hadiah tidak dapat dipindahtangankan atau ditukar uang",
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildVouchersTab() {
    final drawVouchers = userVouchers
        .where((v) => v.drawId == widget.drawEvent.id)
        .toList();

    return SingleChildScrollView(
      padding: EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Voucher Anda",
            style: AppStyle.lg.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.textPrimary,
            ),
          ),
          SizedBox(height: 8),
          Text(
            "Total: ${drawVouchers.length} voucher",
            style: AppStyle.md.copyWith(color: AppColor.textSecondary),
          ),
          SizedBox(height: 16),

          if (drawVouchers.isEmpty)
            _buildEmptyVoucherState()
          else
            ...drawVouchers
                .map((voucher) => _buildVoucherCard(voucher))
                .toList(),

          SizedBox(height: 16),

          _buildInfoCard(
            title: "Cara Mendapat Voucher",
            children: [
              _buildBulletPoint(
                "Lakukan pembelian minimum Rp ${_formatCurrency(widget.drawEvent.minSpending)}",
              ),
              _buildBulletPoint("Voucher otomatis akan masuk ke akun Anda"),
              _buildBulletPoint(
                "Semakin banyak voucher, semakin besar peluang menang",
              ),
              _buildBulletPoint("Voucher berlaku hingga pengundian selesai"),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildTermsTab() {
    return SingleChildScrollView(
      padding: EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Syarat dan Ketentuan",
            style: AppStyle.lg.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.textPrimary,
            ),
          ),
          SizedBox(height: 16),

          _buildTermsSection(
            title: "Syarat Partisipasi",
            terms: [
              "Pengguna harus terdaftar sebagai member Enaklo",
              "Melakukan pembelian minimum Rp ${_formatCurrency(widget.drawEvent.minSpending)}",
              "Pembelian harus dilakukan sebelum waktu pengundian",
              "Satu transaksi pembelian = satu voucher undian",
            ],
          ),

          _buildTermsSection(
            title: "Ketentuan Pengundian",
            terms: [
              "Pengundian dilakukan secara transparan dan fair",
              "Pemenang ditentukan secara acak oleh sistem",
              "Keputusan pengundian bersifat final dan tidak dapat diganggu gugat",
              "Pengumuman pemenang akan dilakukan maksimal 3 hari setelah pengundian",
            ],
          ),

          _buildTermsSection(
            title: "Ketentuan Hadiah",
            terms: [
              "Hadiah harus diambil dalam waktu 30 hari setelah pengumuman",
              "Hadiah yang tidak diambil dalam batas waktu dianggap hangus",
              "Hadiah tidak dapat ditukar dengan uang tunai",
              "Pajak hadiah (jika ada) menjadi tanggung jawab pemenang",
            ],
          ),

          _buildTermsSection(
            title: "Ketentuan Lainnya",
            terms: [
              "Enaklo berhak membatalkan undian jika terjadi kecurangan",
              "Peserta bertanggung jawab atas kebenaran data yang diberikan",
              "Enaklo tidak bertanggung jawab atas kerugian akibat kesalahan peserta",
              "Syarat dan ketentuan dapat berubah sewaktu-waktu tanpa pemberitahuan",
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildInfoCard({
    required String title,
    required List<Widget> children,
  }) {
    return Container(
      width: double.infinity,
      decoration: BoxDecoration(
        color: AppColor.surface,
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: AppColor.black.withOpacity(0.05),
            blurRadius: 8,
            offset: Offset(0, 2),
          ),
        ],
      ),
      child: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              title,
              style: AppStyle.lg.copyWith(
                fontWeight: FontWeight.bold,
                color: AppColor.textPrimary,
              ),
            ),
            SizedBox(height: 12),
            ...children,
          ],
        ),
      ),
    );
  }

  Widget _buildInfoRow(String label, String value) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 4),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 120,
            child: Text(
              label,
              style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
            ),
          ),
          Text(
            ": ",
            style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
          ),
          Expanded(
            child: Text(
              value,
              style: AppStyle.sm.copyWith(
                color: AppColor.textPrimary,
                fontWeight: FontWeight.w500,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildPrizeCard(Prize prize) {
    return Container(
      margin: EdgeInsets.only(bottom: 12),
      decoration: BoxDecoration(
        color: AppColor.surface,
        borderRadius: BorderRadius.circular(12),
        border: Border.all(color: AppColor.borderLight),
        boxShadow: [
          BoxShadow(
            color: AppColor.black.withOpacity(0.05),
            blurRadius: 8,
            offset: Offset(0, 2),
          ),
        ],
      ),
      child: Padding(
        padding: EdgeInsets.all(16),
        child: Row(
          children: [
            Container(
              width: 60,
              height: 60,
              decoration: BoxDecoration(
                color: widget.drawEvent.primaryColor.withOpacity(0.1),
                borderRadius: BorderRadius.circular(30),
              ),
              child: Center(child: Text(prize.icon, style: AppStyle.h4)),
            ),
            SizedBox(width: 16),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    prize.name,
                    style: AppStyle.lg.copyWith(
                      fontWeight: FontWeight.bold,
                      color: AppColor.textPrimary,
                    ),
                  ),
                  SizedBox(height: 4),
                  Text(
                    prize.value,
                    style: AppStyle.md.copyWith(
                      color: AppColor.primary,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  SizedBox(height: 4),
                  Text(
                    prize.description,
                    style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
                    maxLines: 2,
                    overflow: TextOverflow.ellipsis,
                  ),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
              decoration: BoxDecoration(
                color: AppColor.primary.withOpacity(0.1),
                borderRadius: BorderRadius.circular(6),
              ),
              child: Text(
                "${prize.quantity}x",
                style: AppStyle.sm.copyWith(
                  color: AppColor.primary,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildVoucherCard(UserVoucher voucher) {
    Color statusColor;
    String statusText;

    switch (voucher.status) {
      case 'active':
        statusColor = AppColor.success;
        statusText = "Aktif";
        break;
      case 'used':
        statusColor = AppColor.textSecondary;
        statusText = "Terpakai";
        break;
      case 'expired':
        statusColor = AppColor.error;
        statusText = "Kadaluarsa";
        break;
      default:
        statusColor = AppColor.textSecondary;
        statusText = "Tidak Diketahui";
    }

    return Container(
      margin: EdgeInsets.only(bottom: 12),
      decoration: BoxDecoration(
        color: AppColor.surface,
        borderRadius: BorderRadius.circular(12),
        border: Border.all(
          color: voucher.status == 'active'
              ? AppColor.primary.withOpacity(0.3)
              : AppColor.borderLight,
        ),
        boxShadow: [
          BoxShadow(
            color: AppColor.black.withOpacity(0.05),
            blurRadius: 8,
            offset: Offset(0, 2),
          ),
        ],
      ),
      child: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  "Voucher Undian",
                  style: AppStyle.md.copyWith(
                    fontWeight: FontWeight.w600,
                    color: AppColor.textPrimary,
                  ),
                ),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                  decoration: BoxDecoration(
                    color: statusColor.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(6),
                  ),
                  child: Text(
                    statusText,
                    style: AppStyle.xs.copyWith(
                      color: statusColor,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ],
            ),
            SizedBox(height: 8),
            Container(
              padding: EdgeInsets.all(12),
              decoration: BoxDecoration(
                color: AppColor.backgroundLight,
                borderRadius: BorderRadius.circular(8),
                border: Border.all(color: AppColor.borderLight),
              ),
              child: Center(
                child: Text(
                  voucher.voucherNumber,
                  style: AppStyle.lg.copyWith(
                    fontWeight: FontWeight.bold,
                    color: AppColor.textPrimary,
                    letterSpacing: 1.2,
                  ),
                ),
              ),
            ),
            SizedBox(height: 8),
            Text(
              "Diperoleh: ${_formatDateTime(voucher.createdDate)}",
              style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildEmptyVoucherState() {
    return Container(
      width: double.infinity,
      padding: EdgeInsets.all(32),
      decoration: BoxDecoration(
        color: AppColor.surface,
        borderRadius: BorderRadius.circular(12),
        border: Border.all(color: AppColor.borderLight),
      ),
      child: Column(
        children: [
          Icon(Icons.receipt_outlined, size: 64, color: AppColor.textLight),
          SizedBox(height: 16),
          Text(
            "Belum Ada Voucher",
            style: AppStyle.lg.copyWith(
              fontWeight: FontWeight.w600,
              color: AppColor.textPrimary,
            ),
          ),
          SizedBox(height: 8),
          Text(
            "Lakukan pembelian untuk mendapatkan voucher undian",
            style: AppStyle.md.copyWith(color: AppColor.textSecondary),
            textAlign: TextAlign.center,
          ),
          SizedBox(height: 16),
          ElevatedButton(
            onPressed: () {
              // Navigate to shop or show purchase dialog
            },
            style: ElevatedButton.styleFrom(
              backgroundColor: AppColor.primary,
              foregroundColor: AppColor.textWhite,
              padding: EdgeInsets.symmetric(horizontal: 24, vertical: 12),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(8),
              ),
            ),
            child: Text(
              "Belanja Sekarang",
              style: AppStyle.md.copyWith(fontWeight: FontWeight.w600),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTermsSection({
    required String title,
    required List<String> terms,
  }) {
    return Container(
      margin: EdgeInsets.only(bottom: 24),
      decoration: BoxDecoration(
        color: AppColor.surface,
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: AppColor.black.withOpacity(0.05),
            blurRadius: 8,
            offset: Offset(0, 2),
          ),
        ],
      ),
      child: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              title,
              style: AppStyle.lg.copyWith(
                fontWeight: FontWeight.bold,
                color: AppColor.textPrimary,
              ),
            ),
            SizedBox(height: 12),
            ...terms.map((term) => _buildBulletPoint(term)).toList(),
          ],
        ),
      ),
    );
  }

  Widget _buildBulletPoint(String text) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 4),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            margin: EdgeInsets.only(top: 6),
            width: 4,
            height: 4,
            decoration: BoxDecoration(
              color: AppColor.primary,
              shape: BoxShape.circle,
            ),
          ),
          SizedBox(width: 12),
          Expanded(
            child: Text(
              text,
              style: AppStyle.md.copyWith(color: AppColor.textPrimary),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildCoin() {
    return Container(
      width: 24,
      height: 24,
      decoration: BoxDecoration(
        color: AppColor.warning,
        shape: BoxShape.circle,
        border: Border.all(color: Colors.yellow, width: 1),
      ),
      child: Center(
        child: Text(
          "₹",
          style: AppStyle.sm.copyWith(
            color: Colors.orange[800],
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }

  Widget _buildGoldBar() {
    return Container(
      width: 40,
      height: 20,
      decoration: BoxDecoration(
        color: AppColor.warning,
        borderRadius: BorderRadius.circular(4),
        border: Border.all(color: Colors.yellow, width: 1),
      ),
      child: Center(
        child: Text(
          "GOLD",
          style: AppStyle.xs.copyWith(
            color: Colors.orange[800],
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }

  String _formatDateTime(DateTime date) {
    return "${date.day}/${date.month}/${date.year} ${date.hour.toString().padLeft(2, '0')}:${date.minute.toString().padLeft(2, '0')}";
  }
}

// Custom SliverTabBarDelegate
class _SliverTabBarDelegate extends SliverPersistentHeaderDelegate {
  final TabBar _tabBar;

  _SliverTabBarDelegate(this._tabBar);

  @override
  double get minExtent => _tabBar.preferredSize.height;
  @override
  double get maxExtent => _tabBar.preferredSize.height;

  @override
  Widget build(
    BuildContext context,
    double shrinkOffset,
    bool overlapsContent,
  ) {
    return Container(color: AppColor.surface, child: _tabBar);
  }

  @override
  bool shouldRebuild(_SliverTabBarDelegate oldDelegate) {
    return false;
  }
}
