import 'package:dating_touchme_app/extension/ex_widget.dart';
import 'package:dating_touchme_app/generated/assets.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

import '../../controller/mine/league_controller.dart';

class MatchLeaguePage extends StatelessWidget {
  MatchLeaguePage({super.key});
  final LeagueController controller = Get.put(LeagueController());
// 是否同意协议
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(TDIcons.chevron_left, size: 30, color: Colors.black),
          onPressed: () => Get.back(),
        ),
        title: Obx(() => Text(
          '申请${controller.genderCode.value == 0 ? '红娘' : '红娘'}',
          style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
        )),
        centerTitle: true,
        backgroundColor: Colors.white,
      ),
      body: Stack(
        children: [
          Container(
            decoration: BoxDecoration(
              image: DecorationImage(
                image: AssetImage('assets/images/matcher_apply.png'),
                fit: BoxFit.cover,
              ),
            ),
          ),
          Column(
            children: [
              Spacer(),
              Container(
                height: 320.h,
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                    begin: Alignment.topCenter,  // 0%：左边开始
                    end: Alignment.bottomCenter,   // 100%：右边结束
                    colors: [
                      Color.fromRGBO(204, 204, 204, 0),// 右侧深蓝
                      Color.fromRGBO(176, 224, 137, 0.9),  // 紫色
                      Color.fromRGBO(176, 224, 137, 1),  // 紫色
                    ],
                    stops: [0.0, 0.2, 1.0], // 对应 CSS 百分比：0%、77.53%、100%
                  ),
                ),
              )
            ],
          ),
          Obx(() {
            return Padding(
              padding: EdgeInsets.all(12.0),
              child: Column(
                children: [
                  Spacer(),
                  Container(
                    height: 60.h,
                    decoration: BoxDecoration(
                      gradient: LinearGradient(
                        begin: Alignment.centerLeft,  // 0%：左边开始
                        end: Alignment.centerRight,   // 100%：右边结束
                        colors: [
                          Color.fromRGBO(251, 74, 32, 1),  // 紫色
                          Color.fromRGBO(242, 253, 159, 1),// 右侧深蓝
                        ]
                      ),
                      borderRadius: BorderRadius.only(topLeft: Radius.circular(12.0), topRight: Radius.circular(12.0), bottomLeft: Radius.circular(0), bottomRight: Radius.circular(0)),
                    ),
                    padding: EdgeInsets.only(bottom: 12),
                    child: Align(
                      alignment: Alignment.center, // 居中
                      child: Text(
                        '申请${controller.genderCode.value == 0 ? '红娘' : '红娘'}',
                        style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold,color: Colors.white),
                      ),
                    ),
                  ),
                  Transform.translate(
                    offset: Offset(0, -12), // Y轴上移12像素
                    child: Container(
                      height: 272.h,
                      // width: MediaQuery.of(context).size.width - 24,
                      padding: EdgeInsets.only(top: 24, bottom: 24, left: 16, right: 16),
                      decoration: BoxDecoration(
                        color: Colors.white,           // 背景色
                        borderRadius: BorderRadius.circular(12), // 圆角
                      ),
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Row(
                            children: [
                              TDTag('你已申请', style: TDTagStyle(borderRadius: BorderRadius.circular(6), backgroundColor: Color.fromRGBO(251, 76, 33, 1))),
                              SizedBox(width: 4),
                              TDText('累计连麦时长${controller.hours.value}小时即可申请红娘', style: TextStyle(fontSize: 16.w, fontWeight: FontWeight.bold))
                            ],
                          ),
                          SizedBox(height: 24),
                          Row(
                            children: [
                              SizedBox(width: 24),
                              TDText('我已累计连麦：', style: TextStyle(fontSize: 16)),
                              Spacer(),
                              Row(
                                // mainAxisAlignment: MainAxisAlignment.start,
                                // crossAxisAlignment: CrossAxisAlignment,
                                children: [
                                  TDText('${controller.consumption.value.liveDurationMins}', style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, color: Color.fromRGBO(251, 78, 35, 1))),
                                  SizedBox(width: 4),
                                  Padding(
                                    padding: EdgeInsets.only(top: 4),
                                    child: TDText('分钟', style: TextStyle(fontSize: 12)),
                                  ),
                                ],
                              ),
                              SizedBox(width: 24),
                            ],
                          ),
                          Spacer(),
                          TDButton(
                            text: controller.canApply.value ? '去申请' : '去相亲',
                            textStyle: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Colors.white),
                            width: MediaQuery.of(context).size.width - 100,
                            size: TDButtonSize.large,
                            type: TDButtonType.fill,
                            shape: TDButtonShape.round,
                            gradient: LinearGradient(colors: [Color.fromRGBO(255, 85, 78, 1), Color.fromRGBO(254, 147, 72, 1)]),
                            onTap: (){
                              controller.applyMatcher();
                            },
                          )
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            );
          }),
        ],
      ),
    );
  }

}