import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:ysairplane/base/YSBase.dart';
import 'package:ysairplane/code/YSCommnetAdd.dart';
import 'package:ysairplane/tools/YSTools.dart';
import 'package:smooth_star_rating/smooth_star_rating.dart';

class YSComment extends StatefulWidget {
  @override
  _YSCommentState createState() => _YSCommentState();
}

class _YSCommentState extends State<YSComment> {
  List _tags = ['服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）','服务热情(346）',];
  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '点评',
      yschild: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            color: Colors.white,
            width: MediaQuery.of(context).size.width,
            padding: EdgeInsets.all(hsp(30)),
            child: Column(
              children: [
                GestureDetector(
                  onTap: (){
                    Navigator.of(context).push(
                      CupertinoPageRoute(
                        builder: (context){
                          return YSCommentAdd();
                        }
                      )
                    );
                  },
                  child: Container(
                    width: MediaQuery.of(context).size.width,
                    child: Text('评价（32）',style: TextStyle(fontSize: zsp(36),color: Color(0xFF000000),fontWeight: FontWeight.bold),),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(top: hsp(30),bottom: hsp(30),right: wsp(10)),
                  height: hsp(120),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        child: Column(
                          children: [
                            RichText(
                              text: TextSpan(
                                  text: '5.0',
                                  style: TextStyle(fontSize: zsp(60),color: Color(0xFFED5E58),fontWeight: FontWeight.bold),
                                  children: [
                                    TextSpan(
                                      text: '  超赞',
                                      style: TextStyle(fontSize: zsp(24),fontWeight: FontWeight.normal),
                                    )
                                  ]
                              ),
                            ),
                            Text('高于94%同类型航空',style: TextStyle(fontSize: zsp(20),color: Color(0xFF202020)),),
                          ],
                        ),
                        width: wsp(200),
                      ),
                      Container(
                        height: hsp(120),
                        width: MediaQuery.of(context).size.width-hsp(120)-wsp(210)-wsp(60),
                        margin: EdgeInsets.only(left: wsp(10),right: wsp(0)),
                        child: GridView.builder(
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                              crossAxisCount: 2,
                              childAspectRatio: (MediaQuery.of(context).size.width-hsp(120)-wsp(210)-wsp(60))/2/hsp(60)
                          ),
                          itemBuilder: (context, index) {
                            return Container(
                              height: hsp(60),
                              child: Row(
                                children: [
                                  Text('舒适  4.9  ',style: TextStyle(fontSize: zsp(22),color: Color(0xFF202020)),),
                                  Container(
                                    height: hsp(8),
                                    decoration: BoxDecoration(
                                        color: Color(0xFFED5E58),
                                        borderRadius: BorderRadius.all(Radius.circular(50))
                                    ),
                                    width: wsp(75),
                                  )
                                ],
                              ),
                            );
                          },
                          itemCount: 4,
                          padding: EdgeInsets.all(0),
                          physics: NeverScrollableScrollPhysics(),
                        ),
                      )
                    ],
                  ),
                ),
                Container(
                  width: MediaQuery.of(context).size.width-hsp(120),
                  child: Wrap(
                      alignment: WrapAlignment.start,
                      children: <Widget>[
                        for (int i =0;i<_tags.length;i++ ) GestureDetector(
                          behavior: HitTestBehavior.opaque,
                          onTap: (){

                          },
                          child: Container(
                            margin: EdgeInsets.symmetric(vertical: hsp(10), horizontal: hsp(10)),
                            decoration: BoxDecoration(
                                color: Color(0xFFFDF1F1),
                                borderRadius: BorderRadius.all(Radius.circular(5))
                            ),
                            padding: EdgeInsets.only(left: wsp(15), right: wsp(15),top: hsp(10),bottom: hsp(10)),
                            child: Text('${_tags[i]}', style: TextStyle(fontSize: zsp(24),color: Color(0xFF000000)), textAlign: TextAlign.center,),
                          ),
                        )
                      ]
                  ),
                ),
              ],
            ),
          ),
          ListView.separated(
            shrinkWrap: true,
            itemBuilder: (context,index){
              return Container(
                padding: EdgeInsets.all(hsp(30)),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        Container(
                          height: hsp(90),
                          width: hsp(90),
                          margin: EdgeInsets.only(right: wsp(20)),
                          decoration: BoxDecoration(
                              color: Colors.lightGreen,
                              borderRadius: BorderRadius.all(Radius.circular(50))
                          ),
                        ),
                        Container(
                          height: hsp(80),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                children: [
                                  Text('周真美丽',style: TextStyle(fontSize: zsp(28),color: Color(0xFF000000),fontWeight: FontWeight.bold),),
                                  Container(
                                    height: hsp(30),
                                    child: Row(
                                      children: [
                                        Image(image: AssetImage('lib/images/vip2.png'),height: hsp(15),width: wsp(16),),
                                        Text(' 砖石贵宾',style: TextStyle(fontSize: zsp(18),color: Color(0xFFF9DEAC)),)
                                      ],
                                    ),
                                    padding: EdgeInsets.only(left: wsp(7),right: wsp(7)),
                                    margin: EdgeInsets.only(left: wsp(10)),
                                    decoration: BoxDecoration(
                                      color: Color(0xFF000000),
                                      borderRadius: BorderRadius.all(Radius.circular(2))
                                    ),
                                  )
                                ],
                              ),
                              SmoothStarRating(
                                rating: 4.0,
                                isReadOnly: true,
                                size: hsp(30),
                                filledIconData: Icons.star,
                                halfFilledIconData: Icons.star_half,
                                defaultIconData: Icons.star_border,
                                starCount: 5,
                                allowHalfRating: true,
                                spacing: 1.0,
                                onRated: (value) {
                                  print("rating value -> $value");
                                },
                                color: Color(0xFFF97C00),
                                borderColor: Color(0xFFF97C00),
                              )
                            ],
                          ),
                          width: MediaQuery.of(context).size.width-hsp(360),
                        ),
                        Text('2019-3-24 发布',style: TextStyle(fontSize: zsp(22),color: Color(0xFF9A9A9A)),)
                      ],
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    ),
                    Container(
                        margin: EdgeInsets.only(top: hsp(20),bottom: hsp(20)),
                        child: ysTextExpend(text: index==0?'海南航空公司非常好，我很欣赏！航空公司非空欣赏很欣赏很欣赏赏常好我很欣赏！航空公司非常好， 我很欣很欣赏很欣赏很欣赏赏海南航空公司非常好，'
                            '我很欣赏！航空公司非空欣赏很欣赏很欣赏赏常好我很欣赏！航空公司非常好， 我很欣很欣赏很欣赏很欣赏赏':'海南航空公司非常好，我很欣赏海南航空公司非常好，我很欣赏海南航空公司非常好，我很欣赏',
                          style: TextStyle(fontSize: zsp(28),color: Color(0xFF000000)),maxLines: 3,)
                    ),
                    if(index==1)GridView.builder(
                      shrinkWrap: true,
                      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                          crossAxisCount: 3,
                          childAspectRatio: (MediaQuery.of(context).size.width-hsp(140)-wsp(60))/3/hsp(160),
                          crossAxisSpacing: hsp(10),
                          mainAxisSpacing: hsp(10)
                      ),
                      itemBuilder: (context, index) {
                        return Container(
                          height: hsp(160),
                          color: Colors.red.withOpacity((index+1)*0.1),
                        );
                      },
                      itemCount: 3,
                      padding: EdgeInsets.all(0),
                      physics: NeverScrollableScrollPhysics(),
                    )
                  ],
                ),
              );
            },
            separatorBuilder: (context,index){
              return Divider(color: Color(0xFFF1F2F4),height: hsp(10),thickness: hsp(10),);
            },
            itemCount: 3,
            physics: NeverScrollableScrollPhysics(),
          ),
        ],
      ),
    );
  }
}