import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:ysairplane/base/YSBase.dart';
import 'package:ysairplane/tools/YSNetWorking.dart';

import 'YSAuthorSquare.dart';
import 'YSSquareArticle.dart';
import 'YSSquareVideo.dart';

class YSCollection extends StatefulWidget {
  @override
  _YSCollectionState createState() => _YSCollectionState();
}

class _YSCollectionState extends State<YSCollection> {
  List _dataArray = [];
  int _page = 1;
  ScrollController _scrollController = ScrollController();
  @override
  void initState() {
    Future.delayed(Duration(seconds: 0)).then((value){
      _refreshData();
    });
    super.initState();
  }
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '收藏',
      yschild: Container(
        height: MediaQuery.of(context).size.height-MediaQuery.of(context).padding.top-44,
        width: MediaQuery.of(context).size.width,
        color: Color(0xFFF5F6F8),
        child: EasyRefresh(
          onRefresh: _refreshData,
          onLoad: _loadMore,
          header: TaurusHeader(

          ),
          footer: TaurusFooter(

          ),
          child: StaggeredGridView.countBuilder(
            controller: _scrollController,
            crossAxisCount: 4,
            crossAxisSpacing: 8,
            mainAxisSpacing: 8,
            itemCount: _dataArray.length,
            itemBuilder: (context, index) {
              return GestureDetector(
                onTap: (){
                  Navigator.of(context,rootNavigator: true).push(
                      CupertinoPageRoute(
                          builder: (context){
                            return _dataArray[index]['type']==1?YSSquareArticle(squareId: _dataArray[index]['id'],typeId: _dataArray[index]['type'],)
                                :YSSquareVideo(squareId: _dataArray[index]['id'],typeId: _dataArray[index]['type'],);
                          }
                      )
                  );
                },
                child: Stack(
                  children: [
                    Container(
                      color: Colors.white,
                      child:Column(
                        children: [
                          AspectRatio(
                              child: Container(
                                decoration: BoxDecoration(
                                  borderRadius: BorderRadius.only(topLeft: Radius.circular(5),topRight: Radius.circular(5)),
                                ),
                                child: ClipRRect(
                                  borderRadius: BorderRadius.only(topLeft: Radius.circular(5),topRight: Radius.circular(5)),
                                  child: CachedNetworkImage(
                                      imageUrl: _dataArray[index]['type']==0?'${_dataArray[index]['coverPath']}':'${_dataArray[index]['topicCover']}',
                                      fit: BoxFit.fill
                                  ),
                                ),
                              ),
                              aspectRatio: double.parse('${_dataArray[index]['coverWidth']}')/double.parse('${_dataArray[index]['coverHeight']}')
                          ),
                          Container(
                            child: Text(_dataArray[index]['type']==0?'${_dataArray[index]['videoTitle']}':'${_dataArray[index]['topicTitle']}',
                              style: TextStyle(fontSize: 13,color: Color(0xFF333333),decoration: TextDecoration.none,),maxLines: 2,overflow: TextOverflow.ellipsis,),
                            padding: EdgeInsets.all(5),
                            alignment: Alignment.centerLeft,
                          ),
                          Container(
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                GestureDetector(
                                  behavior: HitTestBehavior.opaque,
                                  child: Row(
                                    children: [
                                      Container(
                                        height: 20,
                                        width: 20,
                                        margin: EdgeInsets.only(right: 5),
                                        decoration: BoxDecoration(
                                          color: Colors.black12,
                                          borderRadius: BorderRadius.all(Radius.circular(10)),
                                        ),
                                        child: ClipRRect(
                                          borderRadius: BorderRadius.all(Radius.circular(10)),
                                          child: CachedNetworkImage(
                                            imageUrl: '${_dataArray[index]['user']['avatar']}',
                                            fit: BoxFit.fill,
                                          ),
                                        ),
                                      ),
                                      Container(
                                        width: 70,
                                        child: Text('${_dataArray[index]['user']['nickname']}',
                                          style: TextStyle(fontSize: 12,color: Color(0xFF333333),decoration: TextDecoration.none,),overflow: TextOverflow.ellipsis,),
                                      )
                                    ],
                                  ),
                                  onTap: (){
                                    Navigator.of(context,rootNavigator: true).push(
                                        CupertinoPageRoute(
                                            builder: (context){
                                              return YSAuthorSquare(authorId: int.parse('${_dataArray[index]['user']['id']}'),);
                                            }
                                        )
                                    );
                                  },
                                ),
                                GestureDetector(
                                  behavior: HitTestBehavior.opaque,
                                  child: Row(
                                    children: [
                                      Container(
                                          height: 15,
                                          width: 15,
                                          margin: EdgeInsets.only(right: 5),
                                          child: Image.asset(_dataArray[index]['likeStatus']==0?'lib/images/love.png':'lib/images/love2.png')
                                      ),
                                      Container(
                                        child: Text('${_dataArray[index]['likeCounts']}',style: TextStyle(fontSize: 12,color: Color(0xFFEE564C),decoration: TextDecoration.none,fontWeight: FontWeight.normal),overflow: TextOverflow.ellipsis,),
                                      )
                                    ],
                                    mainAxisSize: MainAxisSize.min,
                                  ),
                                  onTap: (){
                                    _postAgreementData(index);
                                  },
                                ),
                              ],
                            ),
                            padding: EdgeInsets.only(left: 5,right: 5,top: 3,bottom: 5),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      height: 15,
                      margin: EdgeInsets.only(top: 10,left: 10),
                      decoration: BoxDecoration(
                        color: Colors.black12,
                        borderRadius: BorderRadius.all(Radius.circular(7.5)),
                      ),
                      child: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Container(
                              height: 10,
                              width: 15,
                              margin: EdgeInsets.only(right: 3),
                              child: Image.asset('lib/images/eyes2.png')
                          ),
                          Container(
                            child: Text('${_dataArray[index]['likeCounts']}',style: TextStyle(fontSize: 12,color: Colors.white,decoration: TextDecoration.none,fontWeight: FontWeight.normal),overflow: TextOverflow.ellipsis,),
                          )
                        ],
                      ),
                      padding: EdgeInsets.only(left: 8,right: 8),
                    ),
                    _dataArray[index]['type']==0?Container(
                      margin: EdgeInsets.only(left: (MediaQuery.of(context).size.width-25)/2-30,
                          top: (MediaQuery.of(context).size.width-25)/2/(double.parse('${_dataArray[index]['coverWidth']}')/double.parse('${_dataArray[index]['coverHeight']}'))-30),
                      height: 20,
                      width: 20,
                      child: Icon(Icons.play_circle_filled,color: Colors.white,),
                    ):Container()
                  ],
                ),
              );
            },
            staggeredTileBuilder: (index) =>StaggeredTile.fit(2),
            padding: EdgeInsets.only(top: 10),
          ),
        ),
      ),
    );
  }
  Future<void> _refreshData() async{
    _page = 1;
    Map dict = await ysRequestHttp(context,type: requestType.get,api: '/app/piazza/SquareCommunity/myCollect',parameter: {'pageNo':_page,'pageSize':10},isToken: true,refresh: (){
      _refreshData();
    });
    if(dict!=null){
      setState(() {
        _dataArray = dict['data']['resultList'];
      });
    }
  }

  Future<void> _loadMore() async{
    _page++;
    Map dict = await ysRequestHttp(context,type: requestType.get,api: '/app/piazza/SquareCommunity/myCollect',parameter: {'pageNo':_page,'pageSize':10},isToken: true,refresh: (){
      _loadMore();
    });
    if(dict!=null){
      setState(() {
        _dataArray.addAll(dict['data']['resultList']);
      });
    }
  }
  _postAgreementData(int index) async{
    Map request = {'type':1};
    if(_dataArray[index]['type']==0){
      request['squareId'] = _dataArray[index]['id'];
    }else{
      request['topicId'] = _dataArray[index]['id'];
    }
    Map dict = await ysRequestHttp(context,type: requestType.post,api: '/app/piazza/SquareCommunity/likeAndCollect',parameter: request,isLoading: false,isToken: true,refresh: (){

    });
    if(dict!=null){
      setState(() {
        _dataArray[index]['likeStatus'] = dict['data'];
        if(dict['data'] == 0){
          _dataArray[index]['likeCounts'] = int.parse('${_dataArray[index]['likeCounts']}') - 1;
        }else{
          _dataArray[index]['likeCounts'] = int.parse('${_dataArray[index]['likeCounts']}') + 1;
        }
      });
    }
  }


}