import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:trackoffical_app/utils.dart';
import 'package:trackoffical_app/view/mapto/map_to_controller.dart';
import '../../generated/app_api.pb.dart';
import '../../generated/assets.dart';
import '../../screen.dart';
import 'package:trackoffical_app/pb.dart' as pb;

import '../../widget/common.dart';

class ActivityView extends GetView<MapToController> {
  const ActivityView({super.key});
  // const ActivityView(this.mapActivitySimpleInfo, this.userInfo, {super.key});
  // final MapToController mapToController = Get.find();
  // final List<pb.MapActivitySimpleInfo> mapActivitySimpleInfo;
  // final List<ModelUserInfo> userInfo;

  static Bindings bindings() {
    return BindingsBuilder(() {
      Get.lazyPut<MapToController>(() => MapToController());
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 25.69.wp,
      height: context.height,
      padding: EdgeInsets.symmetric(horizontal: 1.wp, vertical: 1.wp),
      decoration: BoxDecoration(
        color: Colors.white,
        // borderRadius: BorderRadius.circular(8),
        // shape: BoxShape.rectangle,
        boxShadow: [
          BoxShadow(
              color: const Color(0x33000000),
              offset: Offset(-0.28.wp, 0.21.wp),
              blurRadius: 0.42.wp)
        ],
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [_wActivitys()],
      ),
    );
  }

  Widget _wActivitys() {
    // var mapActivitySimpleInfo = mapToController.mapActivitySimpleInfo;
    return Obx(() {
      return Expanded(
          child: ListView.builder(
              padding: EdgeInsets.only(top: 0.wp),
              // itemCount: mapActivitySimpleInfo.length,
              itemCount: controller.mapActivityList.value.list.length,
              itemBuilder: (ctx, i) {
                return _wActivityElem(ctx, i);
              }));
    });
  }

  Widget _wActivityElem(BuildContext ctx, int i) {
    // var info = mapActivitySimpleInfo[i].obs;
    var info = controller.mapActivityList.value.list[i];
    var expand = true.obs;

    return Obx(() {
      return GestureDetector(
          // onTap: info.isOpen? ()=>ActivityDetailView.to(info): null,
          child: Container(
        margin:
            EdgeInsets.only(left: 0.wp, right: 0.wp, top: 0.wp, bottom: 1.wp),
        // padding: EdgeInsets.only(left: 0.8.wp, right: 0.8.wp, top: 0.8.wp, bottom: 0.8.wp),
        padding: EdgeInsets.all(0.8.wp),
        decoration: BoxDecoration(
          color: const Color(0xffe0e0e0),
          borderRadius: BorderRadius.circular(0.35.wp),
        ),
        child: Column(
          children: [
            _activityTitle(info, expand),
            expand.value ? _activityControl(info) : Container(),
            expand.value ? _wUserList() : Container(),
          ],
        ),
      ));
    });
  }

  Widget _activityTitle(MapActivitySimpleInfo info, var expand) {
    return Container(
      child: GestureDetector(
        onTap: () {
          // debugPrint("expand.value = ${expand.value}");
          expand.value = !(expand.value);
        },
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            SizedBox(
              width: 16.8.wp,
              child: Text(info.name,
                  softWrap: false,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                      fontSize: 1.29.wp,
                      fontWeight: FontWeight.w700,
                      color: const Color(0xff333333))),
            ),
            SizedBox(width: 0.3.wp),
            Text("(${info.totalControlNum}人)",
                style: TextStyle(
                    fontSize: 1.11.wp,
                    fontWeight: FontWeight.w500,
                    color: const Color(0xff333333))),
            SizedBox(width: 0.6.wp),
            Image.asset(
              expand.value ? Assets.imagesIcArrowUp : Assets.imagesIcArrowDown,
              height: 0.86.wp,
              fit: BoxFit.fitHeight,
            ),
          ],
        ),
      ),
    );
  }

  Widget _activityControl(MapActivitySimpleInfo info) {
    return Container(
        margin: EdgeInsets.only(top: 0.6.wp),
        padding: EdgeInsets.symmetric(vertical: 0.5.wp, horizontal: 1.wp),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(0.42.wp),
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Row(
              children: [
                Text("广播",
                    style: TextStyle(
                        fontSize: 1.11.wp,
                        fontWeight: FontWeight.w500,
                        color: Colors.black)),
                SizedBox(width: 0.5.wp),
                Image.asset(
                  Assets.imagesIcBullhorn,
                  height: 1.13.wp,
                  fit: BoxFit.fitHeight,
                ),
              ],
            ),
            Row(
              children: [
                Image.asset(
                  Assets.imagesIcCp,
                  height: 1.35.wp,
                  fit: BoxFit.fitHeight,
                ),
                SizedBox(width: 0.3.wp),
                Text("${info.totalControlNum}"),
              ],
            ),
            Row(
              children: [
                Text("全部隐藏",
                    style: TextStyle(
                        fontSize: 1.11.wp,
                        fontWeight: FontWeight.w500,
                        color: Colors.black)),
                SizedBox(width: 0.5.wp),
                Image.asset(
                  Assets.imagesIcEye,
                  height: 1.1.wp,
                  fit: BoxFit.fitHeight,
                ),
              ],
            ),
          ],
        ));
  }

  Widget _wUserList() {
    final children = <Widget>[];

    return Obx(() {
      for (var i = 0; i < controller.userInfoList.length; i++) {
        final userInfo = controller.userInfoList[i];

        children.add(Container(
            height: 6.25.wp,
            margin: EdgeInsets.only(top: 0.5.wp),
            padding: EdgeInsets.symmetric(vertical: 0.5.wp, horizontal: 0.5.wp),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(0.42.wp),
            ),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                _wUserInfoRow1(userInfo),
                _wUserInfoRow2(userInfo),
                _wUserInfoRow3(userInfo),
              ],
            )));
      }
      return Column(
        children: children,
      );
    });
  }

  Widget _wUserInfoRow1(ModelUserInfo userInfo) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        wUserMark(userInfo.iUserid!),
        SizedBox(width: 0.5.wp),
        Text(userInfo.sUserName!,
            style: TextStyle(
                fontSize: 1.25.wp,
                fontWeight: FontWeight.w500,
                color: Colors.black)),
        SizedBox(width: 0.5.wp),
        Text("[${userInfo.sRouteCode}]",
            style: TextStyle(
                fontSize: 0.97.wp,
                fontWeight: FontWeight.w400,
                color: Colors.black)),
        const Spacer(),
        Image.asset(
          true ? Assets.imagesIcEye : Assets.imagesIcEyeOff,
          height: 1.1.wp,
          fit: BoxFit.fitHeight,
        ),
        SizedBox(width: 0.5.wp),
      ],
    );
  }

  Widget _wUserInfoRow2(ModelUserInfo userInfo) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        //待打点位
        Container(
          width: 7.81.wp,
          padding: EdgeInsets.symmetric(vertical: 0.wp, horizontal: 0.6.wp),
          decoration: BoxDecoration(
              color: const Color(0xff00a0ff),
              borderRadius: BorderRadius.circular(0.63.wp)),
          child: Text("${userInfo.iNextCPId}号点 (${userInfo.sNextCPCode})",
              textAlign: TextAlign.center,
              softWrap: false,
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                  fontSize: 0.97.wp,
                  fontWeight: FontWeight.w400,
                  color: Colors.white)),
        ),
        // 心率
        Container(
            width: 4.67.wp,
            padding: EdgeInsets.symmetric(vertical: 0.wp, horizontal: 0.9.wp),
            decoration: BoxDecoration(
                color: userInfo.iHr!.toHRPColor(),
                borderRadius: BorderRadius.circular(0.63.wp)),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: [
                Image.asset(Assets.imagesIcHeart,
                    height: 0.82.wp, fit: BoxFit.fitHeight),
                // SizedBox(width: 0.5.wp),
                Text("${userInfo.iHr}",
                    style: TextStyle(
                        fontSize: 0.97.wp,
                        fontWeight: FontWeight.w400,
                        color: Colors.white)),
              ],
            )),
        //配速
        Container(
          width: 6.39.wp,
          padding: EdgeInsets.symmetric(vertical: 0.wp, horizontal: 0.6.wp),
          decoration: BoxDecoration(
              color: const Color(0xffff880f),
              borderRadius: BorderRadius.circular(0.63.wp)),
          child: Text("${userInfo.pacePerKm?.toMinSecondString()}/km",
              textAlign: TextAlign.center,
              softWrap: false,
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                  fontSize: 0.97.wp,
                  fontWeight: FontWeight.w400,
                  color: Colors.white)),
        ),
      ],
    );
  }

  Widget _wUserInfoRow3(ModelUserInfo userInfo) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Text("距离 ${userInfo.iDistance!}m",
            style: TextStyle(
                fontSize: 0.97.wp,
                fontWeight: FontWeight.w400,
                color: Colors.black)),
        SizedBox(width: 0.5.wp),
        Text("时间 ${userInfo.iTime}",
            style: TextStyle(
                fontSize: 0.97.wp,
                fontWeight: FontWeight.w400,
                color: Colors.black)),
        SizedBox(width: 0.5.wp),
        Text("里程 ${userInfo.iMileage} km",
            style: TextStyle(
                fontSize: 0.97.wp,
                fontWeight: FontWeight.w400,
                color: Colors.black)),
      ],
    );
  }
}