import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/view/power_info_card.dart';
import 'package:syncrow_web/utils/constants/assets.dart';

class PhaseWidget extends StatefulWidget {
  final List<Map<String, dynamic>> phaseData;

  PhaseWidget({
    required this.phaseData,
  });
  @override
  _PhaseWidgetState createState() => _PhaseWidgetState();
}

class _PhaseWidgetState extends State<PhaseWidget> {
  int _selectedPhaseIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(height: 10),
        Row(
          children: List.generate(widget.phaseData.length, (index) {
            return InkWell(
              onTap: () {
                setState(() {
                  _selectedPhaseIndex = index;
                });
              },
              child: Padding(
                padding: const EdgeInsets.only(left: 10, right: 10),
                child: Text(
                  widget.phaseData[index]['name'],
                  style: TextStyle(
                    fontWeight: FontWeight.bold,
                    color: _selectedPhaseIndex == index
                        ? Colors.black
                        : Colors.grey,
                  ),
                ),
              ),
            );
          }),
        ),
        SizedBox(height: 10),
        _selectedPhaseIndex == 0
            ? phase(
                totalActive: widget.phaseData[0]['activePower'] ?? '0',
                totalCurrent: widget.phaseData[0]['current'] ?? '0',
                totalFactor: widget.phaseData[0]['powerFactor'] ?? '0',
                totalVoltage: widget.phaseData[0]['voltage'] ?? '0',
              )
            : _selectedPhaseIndex == 1
                ? phase(
                    totalActive: widget.phaseData[1]['activePower'] ?? '0',
                    totalCurrent: widget.phaseData[1]['current'] ?? '0',
                    totalFactor: widget.phaseData[1]['powerFactor'] ?? '0',
                    totalVoltage: widget.phaseData[1]['voltage'] ?? '0',
                  )
                : phase(
                    totalActive: widget.phaseData[2]['activePower'] ?? '0',
                    totalCurrent: widget.phaseData[2]['current'] ?? '0',
                    totalFactor: widget.phaseData[2]['powerFactor'] ?? '0',
                    totalVoltage: widget.phaseData[2]['voltage'] ?? '0',
                  ),
      ],
    );
  }
}

class phase extends StatelessWidget {
  const phase({
    super.key,
    required this.totalVoltage,
    required this.totalCurrent,
    required this.totalActive,
    required this.totalFactor,
  });

  final String totalVoltage;
  final String totalCurrent;
  final String totalActive;
  final String totalFactor;

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              PowerClampInfoCard(
                iconPath: Assets.voltageIcon,
                title: 'Voltage',
                value: totalVoltage,
                unit: '',
              ),
              PowerClampInfoCard(
                iconPath: Assets.voltMeterIcon,
                title: 'Current',
                value: totalCurrent,
                unit: '',
              ),
              PowerClampInfoCard(
                iconPath: Assets.powerActiveIcon,
                title: 'Active Power',
                value: totalActive,
                unit: '',
              ),
              PowerClampInfoCard(
                iconPath: Assets.speedoMeter,
                title: 'Power Factor',
                value: totalFactor,
                unit: '',
              ),
            ],
          ),
        ],
      ),
    );
  }
}