import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:one_key/pages/online_check/photo_view_wiget.dart';

import 'package:one_key/provider/online_check_edit_provider.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/utils.dart';
import 'package:one_key/widgets/MyDivider.dart';
import 'package:one_key/widgets/v_empty_view.dart';
import 'package:provider/provider.dart';

import 'package:image_picker/image_picker.dart';
import 'package:video_player/video_player.dart';

final int MAX_IMAGE_NUMBER = 9;
typedef void OnPickImageCallback(
    double maxWidth, double maxHeight, int quality);

class ImgPickerWidget extends StatefulWidget {
  final ScrollController scrollController;
  final Color borderColor;
  final ValueChanged onChange;
  ImgPickerWidget(
      {Key key,
      this.scrollController,
      this.borderColor = Colors.blue,
      this.onChange})
      : super(key: key);

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

class _ImgPickerWidgetState extends State<ImgPickerWidget> {
  File _image;
  final picker = ImagePicker();
  OnlineCheckEditProvider _onlineCheckEditProvider;

  //相册 相机
  // Future _getFromPictureOrCamera(context, imageSource) async {
  //   File image = await picker.getImage(
  //     source: imageSource,
  //   );
  //   if (image != null) {
  //     _provider.imageList.add(image);
  //     _provider.notifyListeners();
  //   }
  //   // _provider.uploadTravelReleaseImg(image);
  // }

  Future _getFromPictureOrCamera(imageSource) async {
    final pickedFile = await picker.getImage(source: imageSource);

    setState(() {
      if (pickedFile != null) {
        _image = File(pickedFile.path);
        _onlineCheckEditProvider.imageList.add(_image);
        _onlineCheckEditProvider.notifyListeners();
      } else {
        print('No image selected.');
      }
    });
  }

  @override
  void dispose() {
    super.dispose();
  }

  Future _openModalBottomSheet(context) async {
    final option = await showModalBottomSheet(
        context: context,
        backgroundColor: Colors.transparent,
        builder: (BuildContext context) {
          return Container(
            // height: ScreenUtil().setWidth(180 * 2),
            decoration: BoxDecoration(
                color: MyColours.color_ffffff,
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(ScreenUtil().setWidth(24)),
                    topRight: Radius.circular(ScreenUtil().setWidth(24)))),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                InkWell(
                  onTap: () {
                    _getFromPictureOrCamera(ImageSource.camera);
                    Navigator.pop(context);
                  },
                  child: Padding(
                    padding: EdgeInsets.symmetric(
                        vertical: ScreenUtil().setWidth(18 * 2)),
                    child: Text(
                      '拍摄',
                      style: TextStyle(
                          fontSize: ScreenUtil().setSp(32),
                          color: MyColours.color_353535,
                          fontWeight: FontWeight.bold),
                    ),
                  ),
                ),
                MyDivider(
                  double.infinity,
                  ScreenUtil().setWidth(2),
                  color: MyColours.color_EEEEEE,
                ),
                InkWell(
                  onTap: () {
                    _getFromPictureOrCamera(ImageSource.gallery);
                    Navigator.pop(context);
                  },
                  child: Padding(
                    padding: EdgeInsets.symmetric(
                        vertical: ScreenUtil().setWidth(18 * 2)),
                    child: Text(
                      '从相册选择',
                      style: TextStyle(
                          fontSize: ScreenUtil().setSp(32),
                          color: MyColours.color_353535,
                          fontWeight: FontWeight.bold),
                    ),
                  ),
                ),
                MyDivider(
                  double.infinity,
                  ScreenUtil().setWidth(10),
                  color: MyColours.color_EEEEEE,
                ),
                InkWell(
                  onTap: () {
                    Navigator.pop(context, '取消');
                  },
                  child: Padding(
                    padding: EdgeInsets.symmetric(
                        vertical: ScreenUtil().setWidth(18 * 2)),
                    child: Text(
                      '取消',
                      style: TextStyle(
                          fontSize: ScreenUtil().setSp(32),
                          color: MyColours.color_353535,
                          fontWeight: FontWeight.bold),
                    ),
                  ),
                )
              ],
            ),
          );
        });
  }

  _getGridImg(count, context, isLinjie) {
    OnlineCheckEditProvider _provider =
        Provider.of<OnlineCheckEditProvider>(context, listen: false);
    return GridView.builder(
        controller: widget.scrollController,
        // padding: EdgeInsets.only(top: ScreenUtil().getAdapterSize(10)),
        shrinkWrap: true,
        itemCount: count,
        //SliverGridDelegateWithFixedCrossAxisCount 构建一个横轴固定数量Widget
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            //横轴元素个数
            crossAxisCount: 3,
            //纵轴间距
            mainAxisSpacing: 20.0,
            //横轴间距
            crossAxisSpacing: 10.0,
            //子组件宽高长度比例
            childAspectRatio: 1.0),
        itemBuilder: (BuildContext context, int index) {
          //Widget Function(BuildContext context, int index)
          var linjie = MAX_IMAGE_NUMBER;
          if (isLinjie) {
            linjie = MAX_IMAGE_NUMBER - 1;
          }
          if (index == count - 1 && index < linjie) {
            return InkWell(
              onTap: () {
                _openModalBottomSheet(context);
              },
              child: Container(
                  width: ScreenUtil().setWidth(90 * 2),
                  height: ScreenUtil().setWidth(90 * 2),
                  decoration: BoxDecoration(
                    border: Border.all(
                        color: MyColours.color_E0E0E0,
                        width: ScreenUtil().setWidth(2)),
                  ),
                  child: Column(
                    children: [
                      VEmptyView(74),
                      Image.asset(
                        Utils.getImgPath('add_image'),
                        width: ScreenUtil().setWidth(32),
                        height: ScreenUtil().setWidth(32),
                      ),
                      VEmptyView(10),
                      Text(
                        '添加照片',
                        style: TextStyle(
                            fontSize: ScreenUtil().setSp(24),
                            color: MyColours.color_999999),
                      )
                    ],
                  )),
            );
          }
          return _provider.imageList.length < 1
              ? Text('')
              : InkWell(
                  onTap: () {
                    _showPhotoView(context, index, _provider.imageList[index]);
                  },
                  child:
                      Image.file(_provider.imageList[index], fit: BoxFit.cover),
                );
        });
  }

  //查看大图
  _showPhotoView(BuildContext context, int index, List imgs,
      {isShow = false, List dashName}) async {
    // if (imgs.length == 1 &&
    //     imgs[0] ==
    //         'http://nosqn.colorcun.com/custom/lite-online/image/def-banner.png') {
    //   imgs[0] = 'http://nosqn.colorcun.com/app/seller-hj-empty.png';
    // }
    Utils.setBarStatus(false, color: Colors.black);
    dynamic result = await showGeneralDialog(
        context: context,
        barrierDismissible: false,
        // barrierColor: Colors.red,
        barrierLabel:
            MaterialLocalizations.of(context).modalBarrierDismissLabel,
        transitionDuration: const Duration(milliseconds: 150),
        pageBuilder: (BuildContext context, Animation animation,
            Animation secondaryAnimation) {
          Widget child = Stack(
            children: <Widget>[
              PhotoPreview(
                  initialIndex: index,
                  photoList: imgs,
                  isShow: isShow,
                  dashName: dashName)
            ],
          );
          return child;
        });
    Utils.setBarStatus(true, color: Colors.white);
  }

  @override
  Widget build(BuildContext context) {
    _onlineCheckEditProvider =
        Provider.of<OnlineCheckEditProvider>(context, listen: true);
    return Container(
      width: double.infinity,
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(10)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
              height: ScreenUtil().setWidth(53 * 2),
              width: double.infinity,
              decoration: BoxDecoration(
                color: MyColours.color_FAFAFA,
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(10),
                    topRight: Radius.circular(10)),
              ),
              child: Padding(
                padding: EdgeInsets.fromLTRB(
                    ScreenUtil().setWidth(20),
                    ScreenUtil().setWidth(36),
                    ScreenUtil().setWidth(20),
                    ScreenUtil().setWidth(26)),
                child: Text(
                  '消费清单（选填）',
                  style: TextStyle(
                      fontSize: ScreenUtil().setSp(32),
                      color: MyColours.color_353535,
                      fontWeight: FontWeight.bold),
                ),
              )),
          Padding(
            padding: EdgeInsets.all(ScreenUtil().setWidth(40)),
            child: _getGridImg(
                _onlineCheckEditProvider.imageList.length < MAX_IMAGE_NUMBER
                    ? _onlineCheckEditProvider.imageList.length + 1
                    : _onlineCheckEditProvider.imageList.length,
                context,
                _onlineCheckEditProvider.imageList.length == MAX_IMAGE_NUMBER
                    ? true
                    : false),
          )
          //  _getGridImg(1, context)
        ],
      ),
    );
  }
}