import 'package:cached_network_image/cached_network_image.dart';
import 'package:chat/data/UserData.dart';
import 'package:chat/data/WebData.dart';
import 'package:chat/data/constants.dart';
import 'package:chat/generated/i18n.dart';
import 'package:chat/utils/CustomUI.dart';
import 'package:chat/utils/HttpUtil.dart';
import 'package:chat/utils/MessageMgr.dart';
import 'package:chat/utils/TokenMgr.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';

class MoneyPicture extends StatefulWidget {
  @required
  final List imageList;

  MoneyPicture({Key key, this.imageList}) : super(key: key);

  _MoneyPictureState createState() => _MoneyPictureState();
}

class _MoneyPictureState extends State<MoneyPicture> {
  int selectId = 0;
  int originalMoneyId = 0;

  Widget _buildImg(data) {
    var width = (MediaQuery.of(context).size.width - 30) / 3;
    return InkWell(
      onTap: () {
        this.setState(() {
          if (selectId == data['Id']) {
            selectId = 0;
          } else {
            selectId = data['Id'];
          }
        });
      },
      child: Stack(children: <Widget>[
        Container(
            decoration: BoxDecoration(borderRadius: BorderRadius.circular(2.0)),
            width: width,
            height: width,
            padding: EdgeInsets.all(5),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(10),
              child: CachedNetworkImage(
                imageUrl: data['ImgUrl'] == null ? "" : data['ImgUrl'],
                placeholder: CustomUI.buildImgLoding,
                fit: BoxFit.cover,
              ),
            )),
        Positioned(
            right: 0,
            child: Checkbox(
              value: data['Id'] == selectId,
              activeColor: Colors.blue,
              onChanged: (bool val) {
                // val 是布尔值
                this.setState(() {
                  if (selectId == data['Id']) {
                    selectId = 0;
                  } else {
                    selectId = data['Id'];
                  }
                });
              },
            )),
      ]),
    );
  }

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

    for (int i = 0; i < widget.imageList.length; i++) {
      var element = widget.imageList[i];
      if (element['Type'] == PhotoType.money.index ||
          element['Type'] == PhotoType.destroyMoney.index) {
        selectId = element['Id'];
        originalMoneyId = selectId;
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    var list = widget.imageList.map((data) {
      return _buildImg(data);
    }).toList();
    return Scaffold(
        appBar: AppBar(
          backgroundColor: AppColors.NewAppbarBgColor,
          leading: CustomUI.buildCustomLeading(context),
          title: Text(
            I18n.of(context).set_photo,
            style: TextStyle(color: AppColors.NewAppbarTextColor),
            textScaleFactor: 1.0,
          ),
          actions: <Widget>[
            Container(
              alignment: Alignment.center,
              child: new InkWell(
                child: new Padding(
                  padding:
                      EdgeInsets.only(right: 15, left: 15, top: 10, bottom: 10),
                  child: new Text(I18n.of(context).determine,
                      textScaleFactor: 1.0,
                      style: Constants.AppBarActionTextStyle),
                ),
                onTap: () async {
                  if (originalMoneyId == selectId) {
                    Navigator.of(context).pop();
                    return;
                  }
                  Map rdata = {
                    "userId": UserData().basicInfo.userId,
                    "Id": selectId,
                  };
                  rdata['sign'] = TokenMgr().getSign(rdata);

                  Response res = await HttpUtil().post(
                      'user/setting/photosprice',
                      data: rdata,
                      isShowLoading: true);

                  Map resData = res.data;
                  if (resData['code'] == 0) {
                    MessageMgr().emit('refresh_photo');
                    Navigator.of(context).pop();
                  }
                },
              ),
            )
          ],
          centerTitle: true,
        ),
        body: SafeArea(
          child: Container(
              padding: EdgeInsets.only(left: 10, top: 10, bottom: 10),
              height: MediaQuery.of(context).size.height,
              width: MediaQuery.of(context).size.width,
              //alignment: Alignment.center,
              child: SingleChildScrollView(
                child: Wrap(
                  crossAxisAlignment: WrapCrossAlignment.start,
                  children: list,
                ),
              )),
        ));
  }
}