import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';
import 'package:lottie/lottie.dart';

import '../../../resource/assets.gen.dart';
import '../../../resource/colors.gen.dart';
import '../../../utils/styles.dart';
import '../suprise/goods_surprise_controller.dart';

class DiscountTicketDialog {
  static const String tag = 'DiscountTicketDialog';

  static void show({VoidCallback? clickConfirm,VoidCallback? clickCancel}) {
    SmartDialog.show(
      tag: tag,
      backType: SmartBackType.block,
      clickMaskDismiss: false,
      maskColor: ColorName.black70,
      animationType: SmartAnimationType.centerScale_otherSlide,
      onDismiss: () => Get.delete<GoodsSurpriseController>(),
      builder: (_) {
        final controller = Get.find<GoodsSurpriseController>();
        return Stack(
          children: [
            Positioned(
              top: 0,
              left: 0,
              right: 0,
              bottom: 0,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Stack(
                    clipBehavior: Clip.none,
                    children: [
                      Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          SizedBox(
                            width: 360.h,
                            height: 110.h,
                            child: IgnorePointer(
                              child: Lottie.asset(
                                Assets.anim.animDiscountTicketDialogData,
                                repeat: false,
                                fit: BoxFit.contain,
                              ),
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(left: 31.h, right: 14.h),
                            width: 317.w,
                            height: 364.h,
                            decoration: BoxDecoration(
                              image: DecorationImage(
                                image: Assets.images.bgTicketDialog.provider(),
                                fit: BoxFit.cover,
                              ),
                              boxShadow: [
                                BoxShadow(
                                  color: Colors.black.withAlpha(4), // 阴影颜色
                                  blurRadius: 10, // 模糊程度
                                  spreadRadius: 2, // 扩散程度
                                  offset: Offset(4, 4), // 偏移量 (x, y)
                                ),
                              ],
                            ),

                            child: Stack(
                              children: [
                                Column(
                                  mainAxisAlignment: MainAxisAlignment.start,
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    SizedBox(height: 160.h),
                                    Container(
                                      margin: EdgeInsets.only(right: 16.h),
                                      decoration: BoxDecoration(
                                        image: DecorationImage(
                                          image:
                                              Assets.images.bgTicketDialogPrices
                                                  .provider(),
                                          fit: BoxFit.cover,
                                          alignment: Alignment.center,
                                        ),
                                      ),
                                      width: 260.w,
                                      height: 100.h,
                                      child: Column(
                                        children: [
                                          Container(
                                            margin: EdgeInsets.only(top: 10.h),
                                            child: Obx(() {
                                              return Text(
                                                controller.secondAmount?.name ??
                                                    "",
                                                style: TextStyle(
                                                  color: const Color(
                                                    0xFFC39858,
                                                  ),
                                                  fontSize: 14.sp,
                                                  fontWeight: FontWeight.w400,
                                                ),
                                              );
                                            }),
                                          ),
                                          Obx(() {
                                            return Text.rich(
                                              TextSpan(
                                                children: [
                                                  TextSpan(
                                                    text: '￥',
                                                    style: TextStyle(
                                                      color: const Color(
                                                        0xFFF55208,
                                                      ),
                                                      fontSize: 27.sp,
                                                      fontWeight:
                                                          FontWeight.w700,
                                                      height: 0,
                                                    ),
                                                  ),
                                                  TextSpan(
                                                    text:
                                                        controller
                                                            .secondAmount
                                                            ?.amountText,
                                                    style: TextStyle(
                                                      color: const Color(
                                                        0xFFF55208,
                                                      ),
                                                      height: 0,
                                                      fontSize: 36.sp,
                                                      fontWeight:
                                                          FontWeight.w700,
                                                    ),
                                                  ),
                                                ],
                                              ),
                                            );
                                          }),
                                          Obx(() {
                                            return Text(
                                              controller
                                                      .secondAmount
                                                      ?.description ??
                                                  "",
                                              style: TextStyle(
                                                color: Colors.black.withAlpha(
                                                  66,
                                                ),
                                                fontSize: 10.sp,
                                                fontWeight: FontWeight.w400,
                                              ),
                                            );
                                          }),
                                        ],
                                      ),
                                    ),
                                    Container(
                                      margin: EdgeInsets.only(right: 25.h),
                                      width: 317.w,
                                      height: 16.h,
                                      decoration: BoxDecoration(
                                        image: DecorationImage(
                                          image:
                                              Assets
                                                  .images
                                                  .bgTicketDialogPrices2
                                                  .provider(),
                                          fit: BoxFit.cover,
                                        ),
                                      ),
                                    ),
                                    SizedBox(height: 9.h),
                                    GestureDetector(
                                      onTap: () {
                                        clickConfirm?.call();
                                        SmartDialog.dismiss(tag: tag);
                                      },
                                      child: Container(
                                        margin: EdgeInsets.only(right: 20.h),
                                        width: 200.w,
                                        height: 54.h,
                                        child: Assets
                                            .images
                                            .iconTicketDialogButton
                                            .image(width: 200.w, height: 54.h),
                                      ),
                                    ),
                                  ],
                                ),

                                // 倒计时
                                Positioned(
                                  right: 40.w,
                                  child: Container(
                                    height: 24.h,
                                    width: 107.w,
                                    alignment: Alignment.center,
                                    decoration: ShapeDecoration(
                                      gradient: LinearGradient(
                                        begin: Alignment.centerLeft,
                                        end: Alignment.centerRight,
                                        colors: [
                                          const Color(0xFFFF68F4),
                                          const Color(0xFFF96432),
                                        ],
                                      ),
                                      shape: RoundedRectangleBorder(
                                        side: BorderSide(
                                          width: 1,
                                          color: Colors.white,
                                        ),
                                        borderRadius: BorderRadius.only(
                                          topLeft: Radius.circular(15.r),
                                          topRight: Radius.circular(16.r),
                                          bottomRight: Radius.circular(16.r),
                                        ),
                                      ),
                                    ),
                                    margin: EdgeInsets.only(top: 140.h),
                                    child: Obx(() {
                                      int totalMilliseconds =
                                          controller.timeLeft.value;
                                      int minutes = (totalMilliseconds ~/ 6000);
                                      int seconds =
                                          (totalMilliseconds ~/ 100) % 60;
                                      int milliseconds =
                                          (totalMilliseconds % 100); // 毫秒
                                      return Text(
                                        "${minutes.toString().padLeft(2, '0')}:${seconds.toString().padLeft(2, '0')}:${milliseconds.toString().padLeft(2, '0')} 后过期",
                                        style: TextStyle(
                                          color: Colors.white,
                                          fontSize: 12.sp,
                                          fontWeight: FontWeight.w500,
                                        ),
                                      );
                                    }),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),

                  Container(
                    margin: EdgeInsets.only(top: 24.h),
                    child: GestureDetector(
                      onTap: () {
                        SmartDialog.dismiss(tag: tag);
                        clickCancel?.call();
                      },
                      child: Assets.images.iconCharacterDialogClose.image(
                        width: 40.r,
                        height: 40.r,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ],
        );
      },
    );
  }
}

class VerticalDots extends StatelessWidget {
  final double dotSize;
  final double height;
  final Color? color;

  const VerticalDots({
    super.key,
    required this.dotSize,
    required this.height,
    this.color = Colors.white,
  });

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 2.w,
      height: 8.h,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: List.generate(2, (index) {
          return Container(
            width: dotSize,
            height: dotSize,
            decoration: BoxDecoration(color: color, shape: BoxShape.circle),
          );
        }),
      ),
    );
  }
}