import 'dart:async';

import 'package:flutter/material.dart';

import '../../../beans/message_bean.dart';
import '../my_home_model.dart';
import 'message_details_page.dart';

class MessageCenterPage extends StatefulWidget {
  const MessageCenterPage({super.key});

  @override
  State<MessageCenterPage> createState() => _MessageCenterPageState();
}

class _MessageCenterPageState extends State<MessageCenterPage> {
  late StreamSubscription subscription;
  final MyHomeModel _viewModel = MyHomeModel();

  List<MessageBean> messageList = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    subscription = _viewModel.streamController.stream.listen((event) {
      String code = event['code'];
      if (code.isNotEmpty) {
        switch (code) {
          case "getUserMessageList":
            messageList = event['data'];
            break;
        }
        setState(() {});
      }
    });

    _viewModel.getUserMessageList();
  }

  @override
  void dispose() {
    // TODO: implement dispose
    subscription.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    return Scaffold(
      backgroundColor: const Color(0xFF17181A),
      body: Column(
        children: [
          Container(
            width: size.width,
            height: 50,
            margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
            child: Stack(
              alignment: Alignment.center,
              children: [
                Text(
                  "消息中心",
                  style: TextStyle(fontSize: 16, color: Color(0xFFD6D6D7)),
                ),
                Positioned(
                  left: 14,
                  child: GestureDetector(
                    onTap: () {
                      Navigator.pop(context);
                    },
                    child: Image(
                      width: 19,
                      height: 26,
                      image: AssetImage('assets/images/btn_fanhui.png'),
                    ),
                  ),
                )
              ],
            ),
          ),
          Expanded(
              child: Container(
            margin: EdgeInsets.only(left: 14, right: 14, bottom: 20),
            child: ListView.builder(
                padding: EdgeInsets.zero,
                itemCount: messageList.length,
                itemBuilder: (context, index) {
                  return _item(messageList[index]);
                }),
          ))
        ],
      ),
    );
  }

  _item(MessageBean data) {
    return GestureDetector(
      onTap: () {
        Navigator.push(
            context,
            MaterialPageRoute(
              //导航打开新视图
              builder: (context) => MessageDetailsPage(
                messageId: data.messageId!,
                title: data.title!,
              ),
            )).then((value) {
          _viewModel.getUserMessageList();
        });
      },
      child: Container(
        height: 73,
        margin: EdgeInsets.only(top: 18),
        decoration: BoxDecoration(color: Color(0xFF202530), borderRadius: BorderRadius.all(Radius.circular(11))),
        child: Stack(
          alignment: Alignment.center,
          children: [
            Positioned(
              left: 11,
              child: Image(
                width: 45,
                height: 45,
                image: AssetImage('assets/images/ic_system.png'),
              ),
            ),
            Positioned(
              left: 64,
              top: 17,
              child: Text(
                "${data.title}",
                style: TextStyle(fontSize: 14, color: Color(0xFFD6D6D7)),
              ),
            ),
            Positioned(
              left: 64,
              top: 45,
              child: SizedBox(
                width: 200,
                child: Text(
                  "${data.content}",
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(fontSize: 11, color: Color(0xFF939394)),
                ),
              ),
            ),
            Positioned(
              right: 11,
              top: 22,
              child: Text(
                "${data.sendDateTime}",
                style: TextStyle(fontSize: 11, color: Color(0xFF939394)),
              ),
            ),
            Positioned(
              right: 11,
              top: 47,
              child: !data.isRead!
                  ? Container(
                      width: 7,
                      height: 7,
                      decoration: BoxDecoration(color: Colors.red, borderRadius: BorderRadius.all(Radius.circular(10))),
                    )
                  : Container(),
            ),
          ],
        ),
      ),
    );
  }
}