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/data/article.dart';
import 'package:huixiang/data/base_data.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/flutter_utils.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/utils/shared_preference.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/icon_text.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:shared_preferences/shared_preferences.dart';

class HotArticleItem extends StatefulWidget {
  final Article article;
  final bool isHot;

  HotArticleItem({required this.article, required this.isHot});
  @override
  State<StatefulWidget> createState() {
    return _HotArticleItem();
  }
}

class _HotArticleItem extends State<HotArticleItem> {
  ApiService? apiService;

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

    apiService =  ApiService(Dio(), context: context, token: SharedInstance.instance.token ?? "");
  }

  ///关注/取关会员
  _vipFollow(followId) async {
    BaseData? baseData = await apiService?.follow(followId).catchError((onError) {});
    if (baseData?.isSuccess ?? false) {
      SmartDialog.showToast("关注成功");
    }
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        click();
      },
      child: hotItem(context),
    );
  }

  click() async {
    await Navigator.of(context).pushNamed('/router/web_page',
        arguments: {"articleId": widget.article.id});
    widget.article.viewers = ((widget.article.viewers ?? 0) + 1);
    setState(() {});
  }


  Widget hotItem(BuildContext context) {
    return Container(
      padding: EdgeInsets.all((!widget.isHot) ? 4 : 0),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          ),
        ],
        borderRadius: BorderRadius.circular(4),
      ),
      child: (!widget.isHot)
          ?  Column(
        children: [

          Expanded(
              child:Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              SizedBox(height: 5.h),
              Expanded(
                child: Container(
                  margin: EdgeInsets.only(left: 12.w),
                  child: articleTextTow(context),
                ),
              ),
              SizedBox(width: 12.w,),
              Expanded(child:   Visibility(
                visible: widget.article.coverImg != "",
                child:Stack(
                  alignment: Alignment.center,
                  children: [
                    MImage(
                      widget.article.coverImg ?? "",
                      fit: BoxFit.fill,
                      height: double.infinity,
                    ),
                    Visibility(
                      visible: ((widget.article.coverImg??"").endsWith(".mp4")),
                      child: Icon(
                        Icons.play_circle_outline,
                        size: 24,
                        color: Colors.white,
                      ),
                    ),
                  ],
                ),
              ),),
              SizedBox(width:5.w,),
            ],
          ),),
          SizedBox(height: 10.h,)
        ],
      )
          : Column(
              children: articleContent(context),
            ),
    );
  }

  Widget articleText(context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (!widget.isHot)
                ? Text(
              widget.article.mainTitle ?? "",
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      fontWeight: MyFontWeight.medium,
                      fontSize: 14.sp,
                      color: Colors.black,
                    ),
                  )
                : Row(
                    children: [
                      RoundButton(
                        text: "HOT",
                        textColor: Colors.white,
                        backgroup: Color(0xFFFF441A),
                        radius: 2,
                        fontSize: 10.sp,
                        fontWeight: MyFontWeight.medium,
                        padding: EdgeInsets.all(2),
                      ),
                      SizedBox(
                        width: 6.w,
                      ),
                      Expanded(
                        child: Text(
                          widget.article.mainTitle ?? "",
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                          style: TextStyle(
                            fontWeight: MyFontWeight.medium,
                            fontSize: 14.sp,
                            color: Colors.black,
                          ),
                        ),
                        flex: 1,
                      ),
                    ],
                  ),
            SizedBox(
              height: 4.h,
            ),
            Text(
              widget.article.viceTitle ?? "",
              maxLines: AppUtils.textScale(context) > 1.05 ? 1 : 2,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                fontSize: 12.sp,
                fontWeight: MyFontWeight.regular,
                color: Color(0xFF353535),
              ),
            ),
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Expanded(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    widget.article.author?.name ?? "",
                    style: TextStyle(
                      fontSize: 12.sp,
                      fontWeight: MyFontWeight.medium,
                      color: Color(0xFF1A1A1A),
                    ),
                  ),
                  SizedBox(
                    width: 14.w,
                  ),
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/browse.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          "${widget.article.viewers ?? ""}",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    width: 14.w,
                  ),
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/leaving_message.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          "${widget.article.comments ?? ''}",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    width: 14.w,
                  ),
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/follow.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          "${widget.article.likes ?? ''}",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              flex: 1,
            ),
            // if (widget.isHot != null && widget.isHot)
              IconText(
                widget.article.createTime != null
                    ? (widget.article.createTime!.split(" ")[0])
                    : "",
                textStyle: TextStyle(
                  fontSize: 12.sp,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xFFB2B2B2),
                ),
                iconSize: 10,
                iconColor: Color(0xFFB2B2B2),
              ),
          ],
        ),
      ],
    );
  }

  Widget articleTextTow(context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (!widget.isHot)
                ? Text(
              widget.article.mainTitle ?? "",
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                fontWeight: MyFontWeight.medium,
                fontSize: 14.sp,
                color: Colors.black,
              ),
            )
                : Row(
              children: [
                RoundButton(
                  text: "HOT",
                  textColor: Colors.white,
                  backgroup: Color(0xFFFF441A),
                  radius: 2,
                  fontSize: 10.sp,
                  fontWeight: MyFontWeight.medium,
                  padding: EdgeInsets.all(2),
                ),
                SizedBox(
                  width: 6.w,
                ),
                Expanded(
                  child: Text(
                    widget.article.mainTitle ?? "",
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                    style: TextStyle(
                      fontWeight: MyFontWeight.medium,
                      fontSize: 14.sp,
                      color: Colors.black,
                    ),
                  ),
                  flex: 1,
                ),
              ],
            ),
            SizedBox(
              height: 4.h,
            ),
            Text(
              widget.article != null ? (widget.article.viceTitle ?? "") : "",
              maxLines: AppUtils.textScale(context) > 1.05 ? 1 : 2,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                fontSize: 12.sp,
                fontWeight: MyFontWeight.regular,
                color: Color(0xFF353535),
              ),
            ),
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Expanded(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/browse.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          (widget.article != null)
                              ? "${widget.article.viewers}"
                              : "",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    width:22.w,
                  ),
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/leaving_message.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          (widget.article != null)
                              ? "${widget.article.comments}"
                              : "",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    width:22.w,
                  ),
                  Container(
                    alignment: Alignment.topRight,
                    child: Row(
                      children: [
                        Image.asset(
                          "assets/image/follow.webp",
                          width: 16.w,
                          height: 16.h,
                        ),
                        Text(
                          (widget.article != null)
                              ? "${widget.article.likes}"
                              : "",
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              flex: 1,
            ),
          ],
        ),
      ],
    );
  }

  List<Widget> articleContent(context) {
    return [
      Expanded(
        child: Visibility(
          visible: widget.article.coverImg != "",
          child: Stack(
            alignment: Alignment.center,
            children: [
              Positioned(
                child: MImage(
                  widget.article.coverImg ?? "",
                  fit: BoxFit.cover,
                  radius: BorderRadius.vertical(top: Radius.circular(4)),
                  width: MediaQuery.of(context).size.width - 32.w,
                  height: 150.h,
                ),
                top: 0,
                bottom: 0,
                right: 0,
                left: 0,
              ),
              Positioned(
                child: Visibility(
                  visible: (widget.article.coverImg != "" &&
                      widget.article.coverImg!.endsWith(".mp4")),
                  child: Center(
                    child: Icon(
                      Icons.play_circle_outline,
                      size: 24,
                      color: Colors.white,
                    ),
                  ),
                ),
                top: 0,
                bottom: 0,
                right: 0,
                left: 0,
              ),
            ],
          ),
        ),
        flex: 150,
      ),
      Expanded(
        flex: 97,
        child: Container(
          child: articleText(context),
          padding: EdgeInsets.all(8),
        ),
      ),
    ];
  }
}