Traders_Circuit/lib/view/MainScreen/stockDetails/option_chain_screen.dart

import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:gap/gap.dart';
import 'package:get/get.dart' hide FormData;
import 'package:traderscircuit/Utils/Common/comonGlassmorphicContainer.dart';
import 'package:traderscircuit/Utils/Common/sized_box.dart';
import 'package:traderscircuit/Utils/text.dart';
import 'package:traderscircuit/controller/products_controller.dart';
import '../../../Utils/Common/CommonAppBar.dart';
import '../../onBoarding/splashScreen1.dart';

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

  @override
  State<OptionChainScreen> createState() => _OptionChainScreenState();
}

class _OptionChainScreenState extends State<OptionChainScreen> {
  Color _indicatorColor = Color(0xff00C236);
  List<String> containerTexts = [
    "9 MAY",
    "10 MAY",
    "11 MAY",
    "12 MAY",
    "13 MAY"
  ];
  ProductsController productsController = Get.put(ProductsController());
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      drawerEnableOpenDragGesture: false,
      extendBody: true,
      appBar: const CommonAppbar(
        titleTxt: "",
      ),
      body: Stack(
        children: [
          const CommonBlurLeft(),
          const CommonBlurRight(),
          Padding(
            padding: const EdgeInsets.all(15.0),
            child: DefaultTabController(
              length: 5, // Number of tabs
              child: SingleChildScrollView(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    text16W400('TATA MOTORS'),
                    text24W500('₹453.60'),
                    SizedBox(
                      height: 60,
                      width: double.infinity,
                      // color: Colors.amber,
                      child: ListView.builder(
                          shrinkWrap: true,
                          scrollDirection: Axis.horizontal,
                          itemCount: containerTexts.length,
                          itemBuilder: (context, index) {
                            return GestureDetector(
                              onTap: () {
                                productsController.selectedIndex.value = index;
                              },
                              child: Row(
                                children: [
                                  topContainer(containerTexts[index], index),
                                  sizedBoxWidth(10.w),
                                ],
                              ),
                            );
                          }),
                    ),
                    Table(
                      border: TableBorder.symmetric(
                        outside: BorderSide(
                          width: 1,
                          color: Color(0xFF4A73FB).withOpacity(0.3),
                        ),
                      ),
                      columnWidths: {
                        0: FlexColumnWidth(1),
                        1: FlexColumnWidth(1),
                        2: FlexColumnWidth(2),
                        3: FlexColumnWidth(1),
                        4: FlexColumnWidth(1),
                      },
                      children: [
                        TableRow(
                          decoration: BoxDecoration(color: Colors.transparent),
                          children: [
                            tableMainHeader('Calls'),
                            tableMainHeader(''),
                            tableMainHeader('Option Chain'),
                            tableMainHeader(''),
                            tableMainHeader('Puts'),
                          ],
                        ),
                        TableRow(
                          decoration: BoxDecoration(color: Color(0xff00295C)),
                          children: [
                            tableHeader('OI', 'change'),
                            tableHeader('LTP', 'change'),
                            tableHeader('Price', ''),
                            tableHeader('LTP', 'change'),
                            tableHeader('OI', 'change'),
                          ],
                        ),
                        ...List.generate(
                          15,
                          (index) => tableRow(index),
                        ),
                      ],
                    )
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget tableHeader(String text, String text1) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 8.0),
        child: RichText(
          textAlign: TextAlign.center,
          text: TextSpan(
            text: text,
            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 14.sp),
            children: <TextSpan>[
              TextSpan(
                  text: "\n${text1}",
                  style:
                      TextStyle(fontWeight: FontWeight.bold, fontSize: 11.sp)),
            ],
          ),
        ),
      ),
    );
  }

  Widget tableMainHeader(String text) {
    return Center(
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 127.0),
        child: Text(text,
            style: TextStyle(
                color: Colors.white,
                fontWeight: FontWeight.bold,
                fontSize: 16.sp)),
      ),
    );
  }

  TableRow tableRow(int index) {
    return TableRow(
      decoration: BoxDecoration(
        color: index % 2 == 0 ? Colors.transparent : Colors.transparent,
      ),
      children: [
        tableCell('1,43,875', '\n59,625'),
        tableCell('271.00', '\n-45.65'),
        tableCell('22,250', ''),
        tableCell('41.35', '\n-8.20'),
        tableCell('10,07,275', '\n2,71,400'),
      ],
    );
  }

  Widget tableCell(String text, String text1) {
    return Padding(
      padding: const EdgeInsets.all(5.0),
      child: RichText(
        textAlign: TextAlign.center,
        text: TextSpan(
          text: text,
          style: TextStyle(
            fontWeight: FontWeight.w500,
            fontSize: 12.sp,
          ),
          children: <TextSpan>[
            TextSpan(
              text: "\n${text1}",
              style: TextStyle(
                  fontWeight: FontWeight.w300,
                  fontSize: 11.sp,
                  color: Colors.green),
            ),
          ],
        ),
      ),
    );
  }

  Widget topContainer(String text, int index) {
    return Obx(() {
      return productsController.selectedIndex.value == index
          ? Container(
              height: 40.h,
              width: 126.w,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(5),
                color: const Color(0Xff0093FF),
              ),
              child: Center(child: text16W500(text)),
            )
          : commonGlassContainer(
              width: 126.w,
              height: 40.h,
              borderradius: 5,
              customWidget: Center(child: text16W400(text)),
            );
    });
  }
}

List<FlSpot> listData(List<num> data) {
  return data.asMap().entries.map((e) {
    return FlSpot(e.key.toDouble(), e.value.toDouble());
  }).toList();
}

class OptionChainTable extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: SingleChildScrollView(
        child: Column(
          children: [
            Table(
              columnWidths: {
                0: FlexColumnWidth(1),
                1: FlexColumnWidth(1),
                2: FlexColumnWidth(1),
                3: FlexColumnWidth(1),
                4: FlexColumnWidth(1),
                5: FlexColumnWidth(1),
              },
              // border: TableBorder.all(color: Colors.white),
              children: [
                TableRow(
                  decoration: BoxDecoration(color: Colors.black),
                  children: [
                    tableHeader('OI\nchange'),
                    tableHeader('LTP\nchange'),
                    tableHeader('Price'),
                    tableHeader('LTP\nchange'),
                    tableHeader('OI\nchange'),
                  ],
                ),
                ...List.generate(5, (index) => tableRow(index)),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget tableHeader(String text) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Center(
        child: Text(text,
            style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
      ),
    );
  }

  TableRow tableRow(int index) {
    return TableRow(
      decoration: BoxDecoration(
        color: index % 2 == 0
            ? Colors.black.withOpacity(0.8)
            : Colors.black.withOpacity(0.6),
      ),
      children: [
        tableCell('1,43,875\n59,625'),
        tableCell('271.00\n-45.65'),
        tableCell('22,250'),
        tableCell('41.35\n-8.20'),
        tableCell('10,07,275\n2,71,400'),
      ],
    );
  }

  Widget tableCell(String text) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Center(
        child: Text(text, style: TextStyle(color: Colors.white)),
      ),
    );
  }
}