import 'package:flutter/material.dart';
import 'package:liquid_glass_widgets/liquid_glass_widgets.dart';

import 'chat_page.dart';

class MessagePage extends StatelessWidget {
  const MessagePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.transparent,
      appBar: _buildAppBar(),
      body: _buildMessageList(context),
    );
  }

  PreferredSizeWidget _buildAppBar() {
    return AppBar(
      backgroundColor: Color(0xFF120D25),
      elevation: 0,
      centerTitle: true,
      leading: IconButton(
        onPressed: () {},
        icon: const Icon(Icons.menu, size: 22, color: Colors.white),
        splashRadius: 20,
      ),
      title: const Text(
        '消息',
        style: TextStyle(
          fontSize: 18,
          fontWeight: FontWeight.w600,
          color: Colors.white,
        ),
      ),
      actions: [
        IconButton(
          onPressed: () {},
          icon: const Icon(Icons.search, size: 22, color: Colors.white),
          splashRadius: 20,
        ),
        IconButton(
          onPressed: () {},
          icon: const Icon(Icons.add, size: 22, color: Colors.white),
          splashRadius: 20,
        ),
      ],
    );
  }

  Widget _buildMessageList(BuildContext context) {
    return ListView.separated(
      padding: EdgeInsets.only(
        left: 10,
        right: 10,
        top: 10,
        bottom: MediaQuery.of(context).padding.bottom + 80,
      ),
      separatorBuilder: (BuildContext context, int index) {
        return SizedBox(height: 10);
      },
      itemCount: _messages.length,
      itemBuilder: (context, index) {
        final msg = _messages[index];
        return _buildMessageItem(context, msg);
      },
    );
  }

  Widget _buildMessageItem(BuildContext context, Message msg) {
    return GlassCard(
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 0),
      child: ListTile(
        contentPadding: EdgeInsets.zero,
        onTap:
            () => {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder:
                      (_) => const ChatPage(
                        contactName: '张三',
                        avatarUrl: 'https://picsum.photos/id/1012/200',
                      ),
                ),
              ),
            },
        leading: CircleAvatar(
          backgroundColor: Colors.transparent,
          backgroundImage: NetworkImage(msg.avatar),
        ),
        title: Text(
          msg.name,
          style: const TextStyle(
            fontWeight: FontWeight.w500,
            color: Colors.white,
          ),
        ),
        subtitle: Text(
          msg.lastMsg,
          maxLines: 1,
          overflow: TextOverflow.ellipsis,
          style: const TextStyle(fontSize: 13, color: Color(0xFFAEAEB2)),
        ),
        trailing: Text(
          msg.time,
          style: const TextStyle(fontSize: 12, color: Color(0xFF8E8E93)),
        ),
      ),
    );
  }
}

class Message {
  final String name;
  final String avatar;
  final String lastMsg;
  final String time;

  Message({
    required this.name,
    required this.avatar,
    required this.lastMsg,
    required this.time,
  });
}

List<Message> _messages = [
  Message(
    avatar: 'https://picsum.photos/id/1012/200',
    name: '小刘',
    lastMsg: '今晚一起吃饭吗？',
    time: '12:30',
  ),
];