import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:gap/gap.dart';
import 'package:get/get.dart';
import 'package:traderscircuit/controller/contact_us_controller.dart';

import '../../../Utils/Common/CommonAppbar.dart';
import '../../../Utils/Common/commonBotton.dart';
import '../../../Utils/text.dart';
import '../../onBoarding/splashScreen1.dart';
import 'create_ticket_bottom_sheet.dart';

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

  @override
  State<ContactUsMainScreen> createState() => _ContactUsMainScreenState();
}

class _ContactUsMainScreenState extends State<ContactUsMainScreen> {
  ContactUsController contactUsController = Get.put(ContactUsController());
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 4,
      child: Scaffold(
        appBar: CommonAppbar(
          height: 75,
          titleTxt: "",
          customActionWidget: text16W400(""),
        ),
        backgroundColor: Colors.black,
        extendBody: true,
        bottomNavigationBar: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 17, vertical: 40),
          child: SizedBox(
            width: Get.width,
            child: kycBtn(
              text: "Create Ticket",
              onTap: () {
                contactUsController.attachmentFileList.clear();
                contactUsController.attachmentPathNameList.clear();
                CreateTicketBottomSheet().bottomSheet(context);
              },
              bgClr: const Color(0xFF6C0000),
              borderClr: const Color(0xFF990000),
            ),
          ),
        ),
        body: Stack(
          children: [
            const CommonBlurLeft(),
            const CommonBlurRight(),
            Stack(children: [
              Padding(
                  padding:
                      const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
                  child: ListView(
                    physics: const NeverScrollableScrollPhysics(),
                    children: [
                      text25W600("Contact Us"),
                      const Gap(20),
                      text16W400("Hi Afrid,"),
                      text16W400("We are here to help you Us"),
                      const Gap(12),
                      TabBar(
                        labelStyle: TextStyle(
                          fontSize: 18.sp,
                          fontWeight: FontWeight.w400,
                          fontFamily: "manrope",
                        ),
                        isScrollable: true,
                        labelColor: Colors.white,
                        unselectedLabelColor: const Color(0xFF464646),
                        indicatorColor: const Color(0xFF6C0000),
                        indicatorSize: TabBarIndicatorSize.label,
                        unselectedLabelStyle: TextStyle(
                          fontSize: 18.sp,
                          fontWeight: FontWeight.w500,
                          fontFamily: "manrope",
                        ),
                        tabs: const [
                          Tab(text: "All Tickets (2)"),
                          Tab(text: "Open Tickets (2)"),
                          Tab(text: "Closed (1)"),
                          Tab(text: "Resolved (1)"),
                        ],
                      ),
                      SizedBox(
                        height: 0.5.sh,
                        child: TabBarView(children: [
                          ListView.builder(
                              itemCount: dataL.length,
                              itemBuilder: (ctx, index) {
                                return ticketCardWidget(index, "ALL");
                              }),
                          ListView.builder(
                              itemCount: dataL.length,
                              itemBuilder: (ctx, index) {
                                return ticketCardWidget(index, "OPEN");
                              }),
                          ListView.builder(
                              itemCount: dataL.length,
                              itemBuilder: (ctx, index) {
                                return ticketCardWidget(index, "CLOSED");
                              }),
                          ListView.builder(
                              itemCount: dataL.length,
                              itemBuilder: (ctx, index) {
                                return ticketCardWidget(index, "RESOLVED");
                              }),
                        ]),
                      )
                    ],
                  )),
            ]),
          ],
        ),
      ),
    );
  }
}

Widget ticketCardWidget(index, type) {
  return dataL[index]["type"] != type && type != "ALL"
      ? SizedBox()
      : Container(
          width: Get.width,
          height: 190,
          margin: EdgeInsets.only(bottom: 18, top: index == 0 ? 15 : 0),
          decoration: ShapeDecoration(
            gradient: LinearGradient(
              begin: const Alignment(0.98, -0.21),
              end: const Alignment(-0.98, 0.21),
              colors: [
                Colors.white.withOpacity(0.03999999910593033),
                Colors.white.withOpacity(0.05999999865889549)
              ],
            ),
            shape: RoundedRectangleBorder(
              side: const BorderSide(width: 1, color: Color(0xFF393939)),
              borderRadius: BorderRadius.circular(8),
            ),
          ),
          child: Padding(
            padding: const EdgeInsets.symmetric(
              vertical: 15,
              horizontal: 10,
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    text16W600(dataL[index]["id"]),
                    Row(
                      children: [
                        text16W500(dataL[index]["type"],
                            clr: dataL[index]["type"] == "OPEN"
                                ? const Color(0xFFFFAD31)
                                : dataL[index]["type"] == "CLOSED"
                                    ? const Color(0xFF95CCFF)
                                    : const Color(0xFF34C759)),
                        const Gap(8),
                        CircleAvatar(
                          radius: 10,
                          backgroundColor: dataL[index]["type"] == "OPEN"
                              ? const Color(0xFFFFAD31)
                              : dataL[index]["type"] == "CLOSED"
                                  ? const Color(0xFF95CCFF)
                                  : const Color(0xFF34C759),
                          child: const Center(
                            child: Icon(
                              Icons.check_rounded,
                              size: 15,
                              color: Colors.white,
                            ),
                          ),
                        )
                      ],
                    ),
                  ],
                ),
                const Gap(10),
                text16W600(dataL[index]["date"]),
                const Gap(5),
                text16W400(dataL[index]["category"]),
                const Gap(22),
                Container(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 12,
                  ),
                  width: Get.width,
                  height: 50,
                  decoration: ShapeDecoration(
                    color: Colors.black.withOpacity(0.03999999910593033),
                    shape: RoundedRectangleBorder(
                      side:
                          const BorderSide(width: 1, color: Color(0xFF393939)),
                      borderRadius: BorderRadius.circular(8),
                    ),
                  ),
                  child: Center(
                    child: text16W400(dataL[index]["desc"],
                        clr: const Color(0xFF9E9E9E),
                        textOver: TextOverflow.ellipsis),
                  ),
                )
              ],
            ),
          ),
        );
}

List<dynamic> dataL = [
  {
    "id": "#13569412",
    "date": "16 Feb 2024, 11 : 35PM",
    "category": "Account Management",
    "desc":
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.  Lorem Ipsum has been the industry's standard dummy text ever since the 1500",
    "type": "OPEN"
  },
  {
    "id": "#13569412",
    "date": "16 Feb 2024, 11 : 35PM",
    "category": "Technical Support",
    "desc":
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.  Lorem Ipsum has been the industry's standard dummy text ever since the 1500",
    "type": "CLOSED"
  },
  {
    "id": "#13569412",
    "date": "16 Feb 2024, 11 : 35PM",
    "category": "Feedback and Suggestions",
    "desc":
        "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.  Lorem Ipsum has been the industry's standard dummy text ever since the 1500",
    "type": "RESOLVED"
  }
];
