import 'package:dating_touchme_app/components/page_appbar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

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

  @override
  State<PayHistoryPage> createState() => _PayHistoryPageState();
}

class _PayHistoryPageState extends State<PayHistoryPage> {



  List<String> friendNavList = ["赠送记录", "收支详情", "聊天券记录"];

  int friendNavActive = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PageAppbar(title: "交易记录"),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.symmetric(
            vertical: 12.w,
            horizontal: 30.w
          ),
          child: Column(
            children: [
              Row(
                children: [
                  ...friendNavList.asMap().entries.map((entry){
                    return Container(
                      margin: EdgeInsets.only(right: 50.w),
                      child: InkWell(
                        onTap: (){
                          friendNavActive = entry.key;
                          setState(() {

                          });
                        },
                        child: Container(
                          padding: entry.key == friendNavActive ? EdgeInsets.symmetric(vertical: 5.w, horizontal: 26.w) : EdgeInsets.zero,
                          decoration: BoxDecoration(
                              borderRadius: BorderRadius.all(Radius.circular(43.w)),
                              color: entry.key == friendNavActive ? const Color.fromRGBO(117, 98, 249, 1) : Colors.transparent
                          ),
                          child: Text(
                            entry.value,
                            style: TextStyle(
                                fontSize: 24.w,
                                color: entry.key == friendNavActive ? Colors.white : const Color.fromRGBO(51, 51, 51, .7),
                                fontWeight: entry.key == friendNavActive ? FontWeight.w700 : FontWeight.w500
                            ),
                          ),
                        ),
                      ),
                    );
                  }),

                ],
              ),
              SizedBox(height: 8.w,),
              SendItem(),
              SendItem(),
              SendItem(),
              SendItem(),
              SendItem(),
              SizedBox(height: 13.w,),
              Text(
                "没有更多了",
                style: TextStyle(
                  fontSize: 22.w,
                  color: const Color.fromRGBO(144, 144, 144, 1),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}

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

  @override
  State<SendItem> createState() => _SendItemState();
}

class _SendItemState extends State<SendItem> {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 140.w,
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(
            width: 1,
            color: const Color.fromRGBO(219, 219, 219, 1)
          )
        )
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              Container(
                width: 81.w,
                height: 81.w,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(Radius.circular(81.w)),
                  color: const Color.fromRGBO(237, 237, 237, 1)
                ),
                child: Center(
                  child: Image.asset(
                    "assets/rose_gift.png",
                    width: 55.w,
                    height: 55.w,
                  ),
                ),
              ),
              SizedBox(width: 25.w,),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    "视频详情直播间送礼物",
                    style: TextStyle(
                      fontSize: 26.w,
                      color: const Color.fromRGBO(51, 51, 51, 1),
                      fontWeight: FontWeight.w500
                    ),
                  ),
                  Text(
                    "2025-11-03  17:55:55",
                    style: TextStyle(
                      fontSize: 22.w,
                      color: const Color.fromRGBO(144, 144, 144, 1),
                    ),
                  )
                ],
              )
            ],
          ),
          Text(
            "-1支",
            style: TextStyle(
              fontSize: 26.w,
              color: const Color.fromRGBO(227, 84, 84, 1)
            ),
          )
        ],
      ),
    );
  }
}