import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:liftmanager/internal/hospital/hospital_roter.dart';
import 'package:liftmanager/internal/hospital/model/article_item.dart';
import 'package:liftmanager/res/resources.dart';
import 'package:liftmanager/routers/fluro_navigator.dart';
import 'package:liftmanager/utils/image_utils.dart';
import 'package:liftmanager/utils/theme_utils.dart';
import 'package:liftmanager/widgets/app_bar.dart';
import 'package:liftmanager/widgets/load_image.dart';

class HospitalPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HospitalPageState();
  }
}

class HospitalPageState extends State<HospitalPage> {
  List<ArticleItem> list = [
    ArticleItem(
        title: "[三菱]电梯常见故障有哪些？",
        content:
            "1、闭合底层钥匙开关，激战不能开门离开的肌肤轮廓的肌肤抵抗封疆大吏剪六爹上看风景来上课的肌肤来上课的肌肤离开时的肌肤离开时交电费离开时交电费了科技的身份",
        author: Author(
            name: "阮英",
            avatar:
                "https://dss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1305353222,2352820043&fm=26&gp=0.jpg"),
        images: [],
        createdAt: "2020-02-20",
        like: 13),
    ArticleItem(
        title: "[三菱]电梯不能正常开门是什么原因？",
        content:
            "1、闭合底层钥匙开关，激战不能开门离开的肌肤轮廓的肌肤抵抗封疆大吏剪六爹上看风景来上课的肌肤来上课的肌肤离开时的肌肤离开时交电费离开时交电费了科技的身份",
        author: Author(
            name: "彭强强",
            avatar:
                "https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2471723103,4261647594&fm=26&gp=0.jpg"),
        images: [
          ArticleImg(
              url:
                  "http://img3.99114.com/group10/M00/2F/52/rBADslmH99WAZvgiAABvnSElCFg396.jpg"),
          ArticleImg(
              url:
                  "http://img1.99114.com/group10/M00/F1/F0/rBADs1mDTaCAXoGYAABOcC-l-IQ457.jpg"),
          ArticleImg(
              url:
                  "http://img1.99114.com/group10/M00/9D/87/rBADs1ofk1GABugKAAArg-CFe1A183.jpg")
        ],
        createdAt: "2020-02-20",
        like: 145)
  ];

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
        onWillPop: () {
          NavigatorUtils.goBackWithParams(context, true);
          return Future.value(false);
        },
        child: Scaffold(
          appBar: MyAppBar(
            centerTitle: "电梯医院",
            isBack: false,
          ),
          body: Container(
            color: ThemeUtils.getBackgroundColor(context),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Container(
                  padding: EdgeInsets.all(15),
                  color: ThemeUtils.getTabsBg(context),
                  child: Column(
                    children: <Widget>[
                      GestureDetector(
                          onTap: () {
                            NavigatorUtils.push(
                                context, HospitalRouter.hospitalDetailPage);
                          },
                          child: Row(
                            children: <Widget>[
                              CircleAvatar(
                                  radius: 21.5,
                                  backgroundColor: Colors.transparent,
                                  backgroundImage:
                                      ImageUtils.getImageProvider(null)),
                              Gaps.hGap10,
                              Expanded(
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: <Widget>[
                                    Row(
                                      children: <Widget>[
                                        Text(
                                          "快速问诊",
                                          style: TextStyles.textBold24,
                                        ),
                                      ],
                                    ),
                                    Text(
                                      "搜电梯品牌 找专家咨询电梯疑问",
                                      style: TextStyles.textGray13,
                                    )
                                  ],
                                ),
                              ),
                            ],
                          )),
                      Gaps.vGap12,
                      Row(
                        children: <Widget>[
                          CircleAvatar(
                              radius: 21.5,
                              backgroundColor: Colors.transparent,
                              backgroundImage:
                                  ImageUtils.getImageProvider(null)),
                          Gaps.hGap10,
                          Expanded(
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Row(
                                  children: <Widget>[
                                    Text(
                                      "出诊",
                                      style: TextStyles.textBold24,
                                    ),
//                                Gaps.hGap10,
//                                Container(
//                                  decoration: BoxDecoration(
//                                    color: Colours.app_main,
//                                    borderRadius: BorderRadius.circular(6.0),
//                                  ),
//                                  padding: EdgeInsets.fromLTRB(5, 0, 5, 0),
//                                  child: Text("",style: TextStyle(fontSize: 12,color: Colors.white),),
//                                )
                                  ],
                                ),
                                Text(
                                  "在线预约专家上门维修服务",
                                  style: TextStyles.textGray13,
                                )
                              ],
                            ),
                          ),
                        ],
                      )
                    ],
                  ),
                ),
                Gaps.vGap10,
                Container(
                  height: 45,
                  padding: EdgeInsets.only(left: 15, right: 15),
                  alignment: Alignment.centerLeft,
                  decoration: BoxDecoration(
                    color: ThemeUtils.getTabsBg(context),
                    border: Border(
                      bottom: BorderSide(width: 0.5, color: Colours.line),
                    ),
                  ),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Container(
                        padding: EdgeInsets.only(left: 10),
                        decoration: BoxDecoration(
                            border: Border(
                          left: BorderSide(width: 3, color: Colours.app_main),
                        )),
                        child: Text(
                          "热门问题",
                          style: TextStyles.textBold15,
                        ),
                      ),
                    ],
                  ),
                ),
                Expanded(
                    flex: 1,
                    child: ListView.separated(
                        itemBuilder: (_, index) {
                          var item = list[index];
                          bool isDark = ThemeUtils.isDark(context);
                          return InkWell(
                            onTap: () {
//                          NavigatorUtils.push(context,
//                              "${NewsRouter.newsDetail}?id=${item.id}");
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                color: ThemeUtils.getTabsBg(context),
                                border: Border(
                                    bottom: BorderSide(
                                        width: 0.5, color: Colours.line)),
                              ),
                              padding: const EdgeInsets.all(15),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisAlignment: MainAxisAlignment.start,
                                children: <Widget>[
                                  Text(
                                    "${item.title}",
                                    style: TextStyle(
                                        fontSize: 15,
                                        color: isDark
                                            ? Colours.dark_text
                                            : Colours.text),
//                                        overflow: TextOverflow.ellipsis,
                                  ),
                                  Gaps.vGap12,
                                  Text(
                                    "${item.content}",
                                    style: TextStyles.textGray13,
//                                        overflow: TextOverflow.ellipsis,
                                  ),
                                  Offstage(
                                    offstage: list[index].images.length == 0,
                                    child: Gaps.vGap12,
                                  ),
                                  Offstage(
                                    offstage: list[index].images.length == 0,
                                    child: Container(
                                      color: ThemeUtils.getTabsBg(context),
                                      child: _ToolsItem(list[index].images,
                                          (index) {
                                        if (index == 0) {
//                    NavigatorUtils.push(context, AccountRouter.certificatePage);
                                        } else if (index == 1) {
//                    NavigatorUtils.push(context, TeamRouter.teamUserPage);
                                        }
                                      }),
                                    ),
                                  ),
                                  Gaps.vGap12,
                                  Text(
                                    "${item.author.name}·阅读${item.like}次",
                                    style: TextStyle(
                                        fontSize: 11, color: Colours.text_gray),
                                  )
                                ],
                              ),
                            ),
                          );
                        },
                        separatorBuilder: (BuildContext context, int index) {
                          return Container(
                            height: 0.5,
                            color: Color(0xFFF5F5F5),
                          );
                        },
                        itemCount: list.length))
              ],
            ),
          ),
        ));
  }
}

class _ToolsItem extends StatelessWidget {
  _ToolsItem(this.imgs, this.onTap, {Key key}) : super(key: key);

  List<ArticleImg> imgs;
  Function onTap;

  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      shrinkWrap: true,
      padding: const EdgeInsets.fromLTRB(8.0, 0, 8.0, 12.0),
      physics: NeverScrollableScrollPhysics(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 4, childAspectRatio: 0.9, crossAxisSpacing: 2),
      itemCount: imgs.length,
      itemBuilder: (_, index) {
        return InkWell(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                LoadImage(
                  "${imgs[index].url}",
                  width: 80.0,
                  height: 80,
                ),
              ],
            ),
            onTap: () {
              onTap(index);
            });
      },
    );
  }
}
