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

import '../../service/pile/device_type.dart';
import 'real_controller.dart';

class RealItem extends StatelessWidget {
  final int flex;
  final List<Widget> children;
  const RealItem({super.key, required this.children, this.flex = 1});

  @override
  Widget build(BuildContext context) {
    return Expanded(flex: flex, child: Row(children: children));
  }
}

class RealData extends StatelessWidget {
  final RealController realController = Get.put(RealController());
  RealData({super.key});

  @override
  Widget build(BuildContext context) {
    // 设备获取
    late TextStyle titleFontstyle;
    late TextStyle valueFontstyle;
    final deviceType = getDeviceType(context);
    if (deviceType == DeviceType.mobile) {
      titleFontstyle = const TextStyle(fontSize: 15);
      valueFontstyle = const TextStyle(fontSize: 36);
    } else {
      titleFontstyle = const TextStyle(fontSize: 22);
      valueFontstyle = const TextStyle(fontSize: 45);
    }
    Widget space = const SizedBox(
      height: 5,
      width: 5,
    );
    return Expanded(
        flex: 1,
        child: Column(
          children: [
            RealItem(children: [
              RealItemChild(
                // flex: 2,
                title: "速度(m/min)",
                titleFontstyle: titleFontstyle,
                child: Obx(() {
                  return Text(
                    realController.speed.abs() >= 100
                        ? realController.speed.toStringAsFixed(1)
                        : realController.speed.toStringAsFixed(2),
                    style: valueFontstyle,
                  );
                }),
              ),
              space,
              RealItemChild(
                  // flex: 3,
                  title: "时间(min:s)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.time.value,
                        style: valueFontstyle,
                      ))),
              space,
              RealItemChild(
                  // flex: 2,
                  title: "深度(m)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.depth.toStringAsFixed(2),
                        style: valueFontstyle,
                      ))),
            ]),
            space,
            RealItem(children: [
              RealItemChild(
                  // flex: 1,
                  title: "1#瞬时流量(L/min)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.subtotalFlow1.toStringAsFixed(2),
                        style: valueFontstyle,
                      ))),
              space,
              RealItemChild(
                  // flex: 1,
                  title: "2#瞬时流量(L/min)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.subtotalFlow2.toStringAsFixed(2),
                        style: valueFontstyle,
                      ))),
            ]),
            space,
            RealItem(children: [
              RealItemChild(
                  // flex: 1,
                  title: "1#累计流量(L)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.totalFlow1.toStringAsFixed(2),
                        style: valueFontstyle,
                      ))),
              space,
              RealItemChild(
                  // flex: 1,
                  title: "2#累计流量(L)",
                  titleFontstyle: titleFontstyle,
                  child: Obx(() => Text(
                        realController.totalFlow2.toStringAsFixed(2),
                        style: valueFontstyle,
                      ))),
            ])
          ],
        ));
  }
}

class RealItemChild extends StatelessWidget {
  // final int flex;
  final String title;
  final Widget child;
  final TextStyle titleFontstyle;
  RealItemChild(
      {super.key,
      // required this.flex,
      required this.title,
      required this.child,
      required this.titleFontstyle});
  final BoxDecoration boxStyle = BoxDecoration(
      border: Border.all(color: Colors.black26),
      borderRadius: BorderRadius.circular(8.0));
  @override
  Widget build(BuildContext context) {
    return Expanded(
        // flex: flex,
        child: Container(
          decoration: boxStyle,
          child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Text(
                  title,
                  style: titleFontstyle,
                ),
                const SizedBox(
                  height: 10,
                ),
                child
              ]),
        ));
  }
}