import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/utils/flutter_utils.dart';
import 'package:huixiang/utils/font_weight.dart';

import '../data/base_data.dart';
import '../data/channels.dart';
import '../retrofit/retrofit_api.dart';

class ChannelDialog extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _ChannelDialog();
  }
}

class _ChannelDialog extends State<ChannelDialog> {
  late ApiService apiService;
  Channels? channelsList;
  int channelIndex = 0;

  @override
  void initState() {
    super.initState();
    SmartDialog.showLoading(msg: S.current.zhengzaijiazai);
    queryChannels();
  }

  queryChannels() async {
    apiService = ApiService(Dio(), context: context);
    BaseData<Channels> baseData =
        await apiService.appChannels().catchError((error) {
      print(error.message);
      SmartDialog.showToast(AppUtils.dioErrorTypeToString(error.type),
          alignment: Alignment.center);
    });
    if (baseData?.isSuccess ?? false) {
      channelsList = baseData.data;
      setState(() {});
      SmartDialog.dismiss();
    } else {
      SmartDialog.showToast("${baseData?.msg}", alignment: Alignment.center);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      type: MaterialType.transparency,
      child: Center(
        child: Container(
          margin: EdgeInsets.symmetric(horizontal: 14.w),
          decoration: BoxDecoration(
            color: Colors.transparent,
            borderRadius: BorderRadius.circular(8.r),
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(8.w),
                    gradient: LinearGradient(
                      colors: [
                        Color(0xFFDFFFED),
                        Color(0xFFFFFFFF),
                      ],
                      begin: Alignment.topLeft,
                      end: Alignment.bottomLeft,
                    )),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Stack(
                      alignment: Alignment.topRight,
                      children: [
                        Row(
                          children: [
                            SizedBox(
                              width: 11.w,
                            ),
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Image.asset(
                                  "assets/image/channel_text.webp",
                                  width: 138.w,
                                  height: 24.h,
                                  fit: BoxFit.fill,
                                ),
                                Padding(
                                  padding: EdgeInsets.only(top: 11.h),
                                  child: Text(
                                    "您是通过什么途径注册的呢？",
                                    style: TextStyle(
                                      fontSize: 15.sp,
                                      fontWeight: MyFontWeight.bold,
                                      color: Color(0xFF353535),
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            Spacer(),
                            Image.asset(
                              "assets/image/channel_logo.webp",
                              width: 89.w,
                              height: 93.h,
                              fit: BoxFit.fill,
                            ),
                            SizedBox(
                              width: 24.w,
                            )
                          ],
                        ),
                        Container(
                          margin: EdgeInsets.only(top: 24.h, right: 113.w),
                          child: Image.asset(
                            "assets/image/channel_jt.webp",
                            width: 62.w,
                            height: 15.h,
                            fit: BoxFit.fill,
                          ),
                        ),
                      ],
                    ),
                    ConstrainedBox(
                      constraints: BoxConstraints(maxHeight: 260.h),
                      child: Container(
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(8.w),
                        ),
                        margin: EdgeInsets.only(
                          left: 12.w,
                          right: 12.w,
                          bottom: 19.h,
                        ),
                        child: ListView.builder(
                          padding: EdgeInsets.only(top: 16.h),
                          itemCount: channelsList?.channel?.length ?? 0,
                          shrinkWrap: true,
                          physics: BouncingScrollPhysics(),
                          itemBuilder: (context, position) {
                            String str = channelsList!.channel![position];
                            return GestureDetector(
                              behavior: HitTestBehavior.opaque,
                              onTap: () {
                                setState(() {
                                  channelIndex = position;
                                });
                              },
                              child: channelItem(str, position),
                            );
                          },
                        ),
                      ),
                    ),
                    if (channelsList?.channel?.isNotEmpty ?? false)
                      Align(
                        alignment: Alignment.center,
                        child: GestureDetector(
                          behavior: HitTestBehavior.opaque,
                          onTap: () {
                            Navigator.of(context).pop();
                          },
                          child: Text(
                            "我选好了",
                            style: TextStyle(
                              fontSize: 16.sp,
                              fontWeight: MyFontWeight.bold,
                              color: Color(0xFF32A060),
                            ),
                          ),
                        ),
                      ),
                    SizedBox(
                      height: 16.h,
                    )
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  Widget channelItem(String str, int index) {
    return Container(
      padding: EdgeInsets.only(
        left: 14.w,
        right: 14.w,
        bottom: 18.h,
      ),
      child: Row(
        children: [
          Expanded(
            child: Text(
              str,
              style: TextStyle(
                fontSize: 15.sp,
                fontWeight: MyFontWeight.bold,
                color: channelIndex == index
                    ? Color(0xFF32A060)
                    : Color(0xFF353535),
              ),
            ),
          ),
          Image.asset(
            channelIndex == index
                ? "assets/image/icon_radio_selected.webp"
                : "assets/image/icon_radio_unselected.webp",
            width: 15.w,
            height: 15.h,
          ),
        ],
      ),
    );
  }
}