import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:zhiying_base_widget/pages/withdraw_page/withdraw_page.dart';
import 'package:zhiying_base_widget/widgets/home/home_quick_entry/cached_network_image_util.dart';
import 'package:zhiying_base_widget/widgets/wallet/wallet_detail/model/wallet_detail_model.dart';
import 'package:zhiying_base_widget/widgets/wallet/wallet_detail/wallet_detail_sk.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:zhiying_comm/zhiying_comm.dart';

class WalletDetail extends StatefulWidget {
  final Map<String, dynamic> data;

  const WalletDetail(
    this.data, {
    Key key,
  }) : super(key: key);

  @override
  _WalletDetailState createState() => _WalletDetailState();
}

class _WalletDetailState extends State<WalletDetail>
    with TickerProviderStateMixin {
  WalletDetailModel _model;
  TabController _tabController;
  @override
  void initState() {
    if (widget.data != null) {
      _model = WalletDetailModel.fromJson(json.decode(widget.data['data']));
      _tabController =
          TabController(length: _model.providers.length, vsync: this);
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(left: 12.5, right: 12.5),
      child: Column(
        children: <Widget>[
          Container(
            child: TabBar(
                // isScrollable: true,
                controller: _tabController,
                tabs: _buildTabs()),
          ),
          Container(
            height: 75.h,
            child: ListView.builder(
                padding: EdgeInsets.only(top: 16),
                itemCount: _model.dateList.length,
                scrollDirection: Axis.horizontal,
                itemBuilder: _buildTimeItem),
          ),
          Container(
            height: 126.h,
            margin: EdgeInsets.only(top: 16),
            width: double.infinity,
            decoration: BoxDecoration(
                image: DecorationImage(
                    image: CachedNetworkImageProvider(
                        _model.providerDashbord.finish.bgImg),
                    fit: BoxFit.fill)),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Text(
                      "已结算",
                      style: TextStyle(color: Colors.black, fontSize: 22.sp),
                    ),
                    InkWell(
                        child: Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: CachedNetworkImage(
                            imageUrl: "",
                            width: 20.h,
                            height: 20.h,
                            fit: BoxFit.fill,
                          ),
                        ),
                        onTap: () {
                          ///问好
                        })
                  ],
                ),
                Text(
                  "158",
                  style: TextStyle(color: Colors.red, fontSize: 40.sp),
                )
              ],
            ),
          ),
          Container(
            child: ListView.builder(
                itemCount: 3,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (context, index) {
                  return _buildBottomItem(
                      context, index, _model.providerDashbord);
                }),
          )
        ],
      ),
    );
  }

  _buildTabs() {
    List<Widget> listWidget = List();
    for (var item in _model.providers) {
      listWidget.add(Tab(
        child: Text(
          item.name,
          style: TextStyle(color: Colors.grey),
        ),
      ));
    }
    return listWidget;
  }

  Widget _buildTimeItem(BuildContext context, int index) {
    var item = _model.dateList[index];
    return Container(
      margin: EdgeInsets.only(top: 0, left: 8, right: 8),
      decoration: BoxDecoration(
          color: Colors.grey[200], borderRadius: BorderRadius.circular(50)),
      child: Padding(
        padding: const EdgeInsets.only(left: 16, right: 16),
        child: Center(
            child: Text(
          item.text,
          style: TextStyle(color: Colors.grey),
        )),
      ),
    );
  }

  Widget _buildBottomItem(
      BuildContext context, int index, ProviderDashbord dashbord) {
    var item = dashbord.selfBuy;
    return Container(
      child: Column(
        children: <Widget>[
          Text(
            item.title,
            style: TextStyle(color: HexColor.fromHex(item.titleColor)),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Expanded(
                child: Container(
                  height: 123.h,
                  margin: EdgeInsets.only(right: 8),
                  decoration: BoxDecoration(
                      image: DecorationImage(
                          image: CachedNetworkImageProvider(item?.leftBgImg ?? ''),
                          fit: BoxFit.fill)),
                  child: Center(child: Text("ddd")),
                ),
              ),
              Expanded(
                  child: Container(
                    height: 123.h,
                margin: EdgeInsets.only(left: 8),
                decoration: BoxDecoration(
                    image: DecorationImage(
                        image: CachedNetworkImageProvider(item?.rightBgImg ?? ''))),
                child: Center(child: Text("dddd")),
              ))
            ],
          )
        ],
      ),
    );
  }
}