import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_html/image_render.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/main.dart';
import 'package:huixiang/retrofit/data/banner.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/brand_data.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/MyPainter.dart';
import 'package:huixiang/utils/event_type.dart';
import 'package:huixiang/view_widget/border_text.dart';
import 'package:huixiang/view_widget/classic_header.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:huixiang/view_widget/store_title_tab.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:shared_preferences/shared_preferences.dart';

class BrandPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _BrandPage();
  }
}

class _BrandPage extends State<BrandPage>
    with SingleTickerProviderStateMixin, AutomaticKeepAliveClientMixin {
  ScrollController scrollController = ScrollController();

  GlobalKey chiliGlobalKey = GlobalKey();
  GlobalKey milkTeaGlobalKey = GlobalKey();
  GlobalKey breadGlobalKey = GlobalKey();

  ApiService apiService;
  BrandData brandData;
  List<BannerData> bannerData = [];
  List<String> brandText = [];
  var isShowMore = false;

  queryHome() async {
    BaseData baseData = await apiService.queryHome().catchError((error) {
      refreshController.refreshFailed();
    });
    BaseData banner = await apiService.queryBanner({
      "model": {"type": "BRAND_APP"},
    }).catchError((error) {
      refreshController.refreshFailed();
    });
    bannerData.clear();
    bannerData.addAll((banner.data["records"] as List<dynamic>)
        .map((e) => BannerData.fromJson(e))
        .toList());

    if (baseData != null && baseData.isSuccess) {
      refreshController.refreshCompleted();
      brandData = BrandData.fromJson(baseData.data);
      brandText = (brandData.contents as Map<String, dynamic>).keys.toList();
      setState(() {});
    } else {
      refreshController.refreshFailed();
    }
  }

  @override
  void initState() {
    super.initState();

    SharedPreferences.getInstance().then((value) => {
    apiService = ApiService(Dio(),
    context: context, token: value.getString('token')),
    queryHome(),
    if(value.getBool("isFristLogin")){
        showAlertDialog(),
  }});

    eventBus.on<EventType>().listen((event) {
    print("object: BrandPage");
    if (event.type < 3) {
    setState(() {});
    }
    });
  }

  RefreshController refreshController = RefreshController();

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      appBar: AppBar(
        toolbarHeight: 40.h - MediaQuery
            .of(context)
            .padding
            .top,
        backgroundColor: Colors.white,
        elevation: 0,
      ),
      body: Container(
        padding: EdgeInsets.only(bottom: 76.h),
        child: Stack(
          children: [
            Container(
              child: SmartRefresher(
                controller: refreshController,
                enablePullDown: true,
                enablePullUp: false,
                header: MyHeader(),
                physics: ClampingScrollPhysics(),
                onRefresh: queryHome,
                scrollController: scrollController,
                child: Container(
                  child: SingleChildScrollView(
                    physics: NeverScrollableScrollPhysics(),
                    child: Container(
                      color: Color(0xFFF7F7F7),
                      margin: EdgeInsets.only(top: 16.h),
                      child: Column(
                        children: homeChildItem(),
                      ),
                    ),
                  ),
                ),
              ),
            ),
            Positioned(
              child: StoreTitleTab(
                brandText,
                scrollController: scrollController,
                chiliGlobalKey: chiliGlobalKey,
                milkTeaGlobalKey: milkTeaGlobalKey,
                breadGlobalKey: breadGlobalKey,
                isScroll: true,
              ),
              top: 0,
            ),
          ],
        ),
      ),
    );
  }

  List<Widget> homeChildItem() {
    var widgets = <Widget>[
      banner(),
      buildInfo(),
      StoreTitleTab(
        brandText,
        scrollController: scrollController,
        chiliGlobalKey: chiliGlobalKey,
        milkTeaGlobalKey: milkTeaGlobalKey,
        breadGlobalKey: breadGlobalKey,
        isScroll: false,
      )
    ];
    if (brandData == null) return widgets;
    (brandData.contents as Map<String, dynamic>).forEach((key, value) {
      widgets.add(Container(
        key: key == "百年川椒"
            ? chiliGlobalKey
            : (key == "前进麦味" ? breadGlobalKey : milkTeaGlobalKey),
        child: Container(
          color: Colors.white,
          child: Html(
            data: value,
            customImageRenders: {
              base64DataUriMatcher(): base64ImageRender(),
              assetUriMatcher(): assetImageRender(),
              networkSourceMatcher(extension: "svg"): svgNetworkImageRender(),
              networkSourceMatcher(): networkImageRender(loadingWidget: () {
                // return Image.asset("assets/image/default_1.png",);
                return Container();
              }),
            },
          ),
        ),
      ));
    });
    return widgets;
  }

  Widget buildInfo() {
    return Container(
      margin: EdgeInsets.only(bottom: 20, top: 16),
      padding: EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 2),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          GestureDetector(
            onTap: () {
              Navigator.of(context).pushNamed('/router/founder_story_page');
            },
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                ClipOval(
                  child: MImage(
                    brandData == null ? "" : brandData.originAvatar,
                    fit: BoxFit.cover,
                    width: 60.w,
                    height: 60.h,
                    errorSrc: "assets/image/default_1.png",
                    fadeSrc: "assets/image/default_1.png",
                  ),
                  clipBehavior: Clip.hardEdge,
                ),
                SizedBox(
                  width: 16.w,
                ),
                Expanded(
                  child: Container(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text.rich(
                          TextSpan(children: [
                            TextSpan(
                              text:
                              brandData == null ? "" : brandData.originator,
                              style: TextStyle(
                                fontWeight: FontWeight.bold,
                                fontSize: 14.sp,
                                color: Colors.black,
                              ),
                            ),
                            TextSpan(
                              text: "  ${S
                                  .of(context)
                                  .jituanchuangbanren}",
                              style: TextStyle(
                                fontSize: 10.sp,
                                color: Colors.black,
                              ),
                            ),
                          ]),
                          textDirection: TextDirection.ltr,
                        ),
                        Text(
                          brandData == null ? "" : brandData.originDesc,
                          overflow: isShowMore
                              ? TextOverflow.visible
                              : TextOverflow.ellipsis,
                          maxLines: isShowMore ? 10 : 2,
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Colors.black,
                          ),
                        ),
                        SizedBox(height: 3.h),
                        GestureDetector(
                          onTap: () {
                            setState(() {
                              isShowMore = !isShowMore;
                            });
                          },
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.end,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            mainAxisSize: MainAxisSize.max,
                            children: [
                              Text(
                                S
                                    .of(context)
                                    .gengduo,
                                style: TextStyle(
                                  fontSize: 12.sp,
                                  color: Colors.black,
                                ),
                              ),
                              Icon(
                                (isShowMore != null && !isShowMore)
                                    ? Icons.chevron_right
                                    : Icons.keyboard_arrow_up,
                                color: Colors.black,
                                size: 18,
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                  flex: 1,
                ),
              ],
            ),
          ),
          SizedBox(
            height: 40.h,
          ),
          InkWell(
            onTap: () {
              Navigator.of(context).pushNamed('/router/founder_story_page');
            },
            child: Text(
              brandData == null ? "" : brandData.company,
              style: TextStyle(
                fontSize: 16.sp,
                fontWeight: FontWeight.bold,
                color: Colors.black,
              ),
            ),
          ),
          SizedBox(
            height: 20.h,
          ),
          InkWell(
            onTap: () {
              Navigator.of(context).pushNamed('/router/founder_story_page');
            },
            child: Text(
              brandData == null ? "" : brandData.companyDesc,
              textAlign: TextAlign.justify,
              style: TextStyle(
                fontSize: 12.sp,
                color: Color(0xFF353535),
              ),
            ),
          ),
          SizedBox(
            height: 40.h,
          ),
          Text(
            S
                .of(context)
                .linian,
            style: TextStyle(
              fontSize: 16.sp,
              fontWeight: FontWeight.bold,
              color: Colors.black,
            ),
          ),
          SizedBox(
            height: 20.h,
          ),
          InkWell(
            onTap: () {
              Navigator.of(context).pushNamed('/router/founder_story_page');
            },
            child: Column(
              children: [
                Row(
                  children: [
                    _ideaWidget("友爱", "assets/image/icon_idea_ya.png"),
                    _ideaWidget("纯净", "assets/image/icon_idea_cj.png"),
                    _ideaWidget("健康", "assets/image/icon_idea_jk.png"),
                  ],
                ),
                SizedBox(
                  height: 18.h,
                ),
                Row(
                  children: [
                    _ideaWidget("有机", "assets/image/icon_idea_yj.png"),
                    _ideaWidget("环保", "assets/image/icon_idea_hb.png"),
                    _ideaWidget("智慧", "assets/image/icon_idea_zh.png"),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  //理念板块
  // List<Widget> buildIdea() {
  //   if (brandData == null) return [];
  //   var ideas = <Widget>[];
  //   (brandData.ideals as Map<String, dynamic>).forEach((key, value) {
  //     ideas.add(idea(key, value));
  //   });
  //   return ideas;
  // }

  Widget _ideaWidget(var text, String img) {
    return Expanded(
      flex: 1,
      child: Stack(
        alignment: Alignment.center,
        children: [
          Container(
            width: 63,
            height: 63.h,
            child: Stack(
              alignment: Alignment.center,
              children: [
                Align(
                  child: CircleAvatar(
                    child: Image.asset(img),
                    radius: 100,
                  ),
                ),
                Text(
                  text,
                  style: TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.w300,
                      color: Colors.white),
                )
              ],
            ),
            // CircleAvatar(
            //   radius: 100,
            //   backgroundImage: Image.asset(img),
            //   child: Container(
            //       alignment: Alignment.center,
            //       child: Text(
            //         text,
            //         style: TextStyle(
            //             fontSize: 18,
            //             fontWeight: FontWeight.w300,
            //             color: Colors.white),
            //       )),
            // ),
          ),
          Container(
            width: 73,
            height: 73.h,
            child: CustomPaint(
              painter: MyPainter(
                  lineColor: Color(0xff32A060), width: 2, isDividerRound: true),
            ),
          )
        ],
      ),
    );
  }

  banner() {
    return Container(
      child: AspectRatio(
        aspectRatio: 2.08,
        child: Swiper(
            viewportFraction: 0.88,
            scale: 0.93,
            pagination: SwiperPagination(
              alignment: Alignment.bottomCenter,
              builder: DotSwiperPaginationBuilder(
                size: 8,
                activeSize: 8,
                space: 5,
                activeColor: Colors.black,
                color: Colors.black.withAlpha(76),
              ),
            ),
            physics: BouncingScrollPhysics(),
            itemBuilder: (context, position) {
              return InkWell(
                onTap: () {
                  bannerClick(bannerData[position]);
                },
                child: MImage(
                  (bannerData != null && position < bannerData.length)
                      ? bannerData[position].imgUrl
                      : "",
                  fit: BoxFit.cover,
                  radius: BorderRadius.circular(8),
                  errorSrc: "assets/image/default_2_1.png",
                  fadeSrc: "assets/image/default_2_1.png",
                ),
              );
            },
            itemCount: (bannerData != null && bannerData.length > 0)
                ? bannerData.length
                : 1),
      ),
    );
  }

  showAlertDialog() {
    //显示对话框
    showDialog(
      context: context,
      builder: (BuildContext context) {
        return SimpleDialog(
          titlePadding: EdgeInsets.all(10),
          backgroundColor: Colors.transparent,
          elevation: 0,
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.all(Radius.circular(6))),
          children: <Widget>[
            Stack(
              alignment: Alignment.bottomCenter,
              children: [
                Container(
                  alignment: Alignment.center,
                  width: double.infinity,
                  height: 305.h,
                  // margin: EdgeInsets.only(left: 40.w, right: 40.w),
                  padding: EdgeInsets.only(left: 16.w, right: 16.w),
                  decoration: new BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(8))),
                  child: Column(
                    children: [
                      Padding(
                        padding: EdgeInsets.only(top: 24.h, bottom: 10.h),
                        child: Text(
                          S
                              .of(context)
                              .xieyitanchuang,
                          style: TextStyle(
                              color: Color(0xff4D4D4D),
                              fontSize: 18.sp,
                              fontWeight: FontWeight.bold),
                        ),
                      ),
                      Text.rich(
                        TextSpan(children: [
                          TextSpan(
                            text:
                            "     感谢您使用一心回乡APP。我们非常重视您的个人信息和隐私保护。为了更好地保证您的个人权益，在您使用我们的产品前，请务必仔细阅读一心回乡",
                            style: TextStyle(
                                fontWeight: FontWeight.w500,
                                fontSize: 14.sp,
                                height: 1.3.h,
                                color: Color(0xff727272)),
                          ),
                          TextSpan(
                            text: S
                                .of(context)
                                .yinsixieyi,
                            style: TextStyle(
                                fontWeight: FontWeight.w500,
                                fontSize: 14.sp,
                                color: Color(0xff32A060)),
                            recognizer: TapGestureRecognizer()
                              ..onTap = () {
                                debugPrint(
                                    "${Navigator.of(context).popAndPushNamed(
                                        '/router/treaty_page')}");
                              },
                          ),
                        ]),
                      ),
                      SizedBox(
                        height: 10.h,
                      ),
                      Text(
                        "     在您同意后，我们才会根据您的使用需求，收集部分可能涉及的数据(地理位置、相机、存储等信息)。",
                        style: TextStyle(
                          color: Color(0xff727272),
                          fontSize: 14.sp,
                          height: 1.3.h,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                      SizedBox(
                        height: 16.h,
                      ),
                    ],
                  ),
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    GestureDetector(
                      onTap: () {
                        Navigator.of(context).pop();
                      },
                      child: Container(
                        height: 40.h,
                        alignment: Alignment.bottomCenter,
                        margin: EdgeInsets.only(bottom: 20.h),
                        child: BorderText(
                          padding: EdgeInsets.only(
                              top: 10.h, bottom: 10.h, left: 36.w, right: 36.w),
                          text: "不同意",
                          fontSize: 12.sp,
                          textColor: Color(0xFF32A060),
                          borderColor: Color(0xFF32A060),
                          borderWidth: 1.w,
                          radius: 23,
                        ),
                      ),
                    ),
                    SizedBox(
                      width: 21.w,
                    ),
                    Container(
                      height: 40.h,
                      margin: EdgeInsets.only(bottom: 20.h),
                      alignment: Alignment.bottomCenter,
                      child: RoundButton(
                        text: "同意并继续",
                        textColor: Colors.white,
                        fontSize: 12,
                        callback: () {
                          Navigator.of(context).pop();
                        },
                        padding: EdgeInsets.only(
                            top: 10.h,
                            bottom: 10.h,
                            left: 21.5.w,
                            right: 21.5.w),
                        backgroup: Color(0xff32A060),
                        radius: 23,
                      ),
                    ),
                    SizedBox(
                      height: 20.h,
                    ),
                  ],
                ),
              ],
            )
          ],
        );
      },
    );
  }

  /// contentType     跳转类型（0：不跳转，1：积分商品，2：活动，3：文章）
  bannerClick(BannerData bannerData) async {
    switch (bannerData.contentType) {
      case 1:
        Navigator.of(context).pushNamed('/router/integral_store_page',
            arguments: {"goodsId": bannerData.content});
        break;
      case 2:
        Navigator.of(context)
            .pushNamed('/router/store_detail_page', arguments: {
          "activityId": bannerData.content,
        });
        break;
      case 3:
        Navigator.of(context)
            .pushNamed('/router/store_detail_page', arguments: {
          "articleId": bannerData.content,
        });
        break;
    }
  }

  Widget idea(key, value) {
    return Expanded(
      flex: 1,
      child: Stack(
        alignment: Alignment.center,
        children: [
          Container(
            width: 63.w,
            height: 63.h,
            child: CircleAvatar(
              radius: 100,
              backgroundImage: NetworkImage(value),
              child: Container(
                alignment: Alignment.center,
                child: Text(
                  key,
                  style: TextStyle(
                    fontSize: 16.sp,
                    fontWeight: FontWeight.w300,
                    color: Colors.white,
                  ),
                ),
              ),
            ),
          ),
          Container(
            width: 73.w,
            height: 73.h,
            child: CustomPaint(
              painter: MyPainter(
                lineColor: Color(0xff32A060),
                width: 2.w,
                isDividerRound: true,
              ),
            ),
          )
        ],
      ),
    );
    //   Stack(
    //   children: [
    //     MImage(
    //       value,
    //       width: 71,
    //       height: 71,
    //       fit: BoxFit.cover,
    //       errorSrc: "assets/image/default_1.png",
    //       fadeSrc: "assets/image/default_1.png",
    //     ),
    //     Positioned(
    //       bottom: 0,
    //       child: Container(
    //         width: 71,
    //         decoration: BoxDecoration(
    //           color: Colors.black.withAlpha(125),
    //           borderRadius: BorderRadius.only(
    //             bottomRight: Radius.circular(4),
    //             bottomLeft: Radius.circular(4),
    //           ),
    //         ),
    //         padding: EdgeInsets.symmetric(vertical: 2),
    //         alignment: Alignment.center,
    //         child: Text(
    //           key,
    //           style: TextStyle(
    //             color: Colors.white,
    //             fontSize: 12.sp,
    //           ),
    //         ),
    //       ),
    //     )
    //   ],
    // );
  }

  @override
  bool get wantKeepAlive => true;
}