import 'package:e2ee_chat/common/global.dart';
import 'package:e2ee_chat/models/message_model.dart';
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:provider/provider.dart';

class MessageList extends StatefulWidget {
  @override
  _MessageListState createState() => _MessageListState();
}

class _MessageListState extends State<MessageList> {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<MessageListModel>(
      create: (context) {
        return MessageListModel();
      },
      child: Builder(
        builder: (context) {
          var provider = Provider.of<MessageListModel>(context);
          return ListView.builder(itemCount: provider.count, itemBuilder: (context, index) {
            var _item = provider.items[index];
            return Slidable(
              actionPane: SlidableDrawerActionPane(),
              actionExtentRatio: 0.25,
              secondaryActions: <Widget>[
                IconSlideAction(
                  caption: '取消置顶',
                  color: Colors.black45,
                  icon: Icons.more_horiz,
                  onTap: () {},
                ),
                IconSlideAction(
                  caption: '删除',
                  color: Colors.redAccent,
                  icon: Icons.delete,
                  onTap: () => {},
                ),
              ],
              child: Padding(
                padding: EdgeInsets.only(left: 36, bottom: 20, top: 20),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Expanded(child: MessageItem(_item)),
                    _item.isStick
                        ? Container(
                      width: 40,
                      height: 48,
                      margin: EdgeInsets.only(top: 10, right: 10),
                      child: Icon(Icons.star)
                    )
                        : Padding(
                      padding: EdgeInsets.symmetric(horizontal: 24),
                    )
                  ],
                ),
              ),
            );
          });
        },
      ),
    );
  }
}

class MessageItem extends StatelessWidget {
  final MessageItemModel model;

  MessageItem(this.model);

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        model.avatar ?? Global.defaultAvatar,
        Expanded(
          child: Column(
            children: <Widget>[
              Padding(
                padding: EdgeInsets.symmetric(vertical: 8),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Expanded(
                      child: Text(
                        model.chatName,
                        style: TextStyle(fontSize: 34),
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
                    Text(
                      _formatDate(),
                      style: TextStyle(fontSize: 26),
                      overflow: TextOverflow.ellipsis,
                    ),
                  ],
                ),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  Expanded(
                    child: RichText(
                      text: TextSpan(children: [
                        TextSpan(
                          text: model.isAtYou ? "[@你]" : "",
                          style:
                          TextStyle(fontSize: 28),
                        ),
                        TextSpan(
                          text: model.isSpecialAttention ? "[特别关注]" : "",
                          style:
                          TextStyle(fontSize: 28),
                        ),
                        TextSpan(
                          text: model.isAtAll ? "[@所有人]" : "",
                          style:
                          TextStyle(fontSize: 28),
                        ),
                        TextSpan(
                          text: model.message,
                          style: TextStyle(fontSize: 28),
                        )
                      ]),
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                  (model.unReadCount > 0 && !model.isDisturbing)
                      ? Container(
                      width: 32,
                      height: 32,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(20)),
                      child: Text(
                        model.unReadCount.toString(),
                        style: TextStyle(
                            color: Colors.white, fontSize: 26),
                      ))
                      : Container(),
                  model.isDisturbing
                      ? Row(
                    children: <Widget>[
                      Icon(Icons.visibility_off),
                      model.unReadCount > 0
                          ? Icon(Icons.chat_bubble, color: Colors.red,) // TODO: 小红点
                          : Container()
                    ],
                  )
                      : Container()
                ],
              )
            ],
          ),
        )
      ],
    );
  }

  String _formatDate() {
    DateTime dateTime =
    DateTime.fromMillisecondsSinceEpoch(model.time);
    return "${dateTime.hour}:${dateTime.minute}";
  }
}