import 'package:flutter/material.dart';
import 'package:project_telephony/base/base_style.dart';
import 'package:project_telephony/utils/headers.dart';

typedef ItemCallback = Function(ChooseItems item, int index);

class ChooseItems {
  int month;
  int pice;
  bool isChoose;

  ChooseItems({
    required this.month,
    required this.pice,
    this.isChoose = false,
  });
}

class SortWidget extends StatelessWidget {
  final List<ChooseItems> itemList;
  final ItemCallback callback;
  final int crossAxisCount;
  final double mainAxisSpacing;
  final double crossAxisSpacing;
  final double childAspectRatio;
  final bool haveButton;
  final ChooseItems? pickItem;

  const SortWidget(
      {Key? key,
      required this.itemList,
      required this.callback,
      required this.crossAxisCount,
      required this.mainAxisSpacing,
      required this.crossAxisSpacing,
      required this.childAspectRatio,
      this.haveButton = false,
      required this.pickItem});

  @override
  Widget build(BuildContext context) {
    return GridView.builder(
        physics: const NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        padding: EdgeInsets.zero,
        itemCount: itemList.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            //横轴元素个数
            crossAxisCount: crossAxisCount,
            //纵轴间距
            mainAxisSpacing: mainAxisSpacing,
            //横轴间距
            crossAxisSpacing: crossAxisSpacing,
            //子组件宽高长度比例
            childAspectRatio: childAspectRatio),
        itemBuilder: (BuildContext context, int index) {
          return _getItem(itemList[index], index);
        });
  }

  _getItem(ChooseItems item, int index) {
    return GestureDetector(
      onTap: () {
        callback(item, index);
      },
      child: Container(
          alignment: Alignment.center,
          decoration: BoxDecoration(
              color: pickItem == item
                  ? const Color(0xFFFFFAEA)
                  : const Color(0xFFFFFFFF),
              borderRadius: BorderRadius.circular(4.w),
              border: pickItem != item
                  ? Border.all(color: const Color(0xFFF5F5F5), width: 1.w)
                  : Border.all(color: const Color(0xFFFFDF66), width: 1.w)),
          child: Column(
            children: [
              Padding(padding: EdgeInsets.only(top: 16.w)),
              Text(
                "${item.month}个月VIP",
                style: TextStyle(
                    fontSize: BaseStyle.fontSize28,
                    color: BaseStyle.color333333,
                    fontWeight: FontWeight.bold),
              ),
              Text.rich(TextSpan(children: [
                TextSpan(
                    text: "¥",
                    style: TextStyle(
                        fontSize: BaseStyle.fontSize32,
                        color: pickItem == item
                            ? const Color(0xFFFF3F3F)
                            : BaseStyle.color333333)),
                TextSpan(
                    text: "${item.pice}",
                    style: TextStyle(
                        fontSize: 64.sp,
                        color: pickItem == item
                            ? const Color(0xFFFF3F3F)
                            : BaseStyle.color333333))
              ])),
              Text(
                "${(item.pice / item.month).toStringAsFixed(2)}元/月",
                style: TextStyle(
                    fontSize: BaseStyle.fontSize24,
                    color: BaseStyle.color999999,
                    fontWeight: FontWeight.bold),
              ),
            ],
          )),
    );
  }
}