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

import 'package:shimmer/shimmer.dart';

import '../../../Controller/More/Staffs/Staffscontroller.dart';
import '../../../Helper/Constants/AssetConstants.dart';
import '../../../Helper/Constants/Colorconstants.dart';
import '../../../Helper/utility.dart';
import '../../Home/Homeview.dart';
import '../Locations/Addlocation/Addlocationview.dart';
import 'Addstaff/Addstaffview.dart';
import 'Updatestaff/Updatestaffview.dart';

class StaffsView extends StatelessWidget {
  StaffsView({super.key});
  StaffsController staffsController = Get.put(StaffsController());

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        Get.to(()=>HomeView(selectedIndex: 3));
        return false;
      },
      child: Scaffold(
        backgroundColor: ColorConstants.lightColor,
        appBar: AppBar(
          backgroundColor: ColorConstants.primaryColor,
          elevation: 0.3,
          leading: Padding(
            padding: const EdgeInsets.all(5.0),
            child: Image(
              image: AssetImage(AssetConstants.NearleAppbarIcon),
              height: 30,
            ),
          ),
          title: Text('Staffs',
              style: TextStyle(color: ColorConstants.secondaryColor)),
          titleSpacing: 0,
        ),
        body: Stack(
          children: [
            Column(
              children: [
                SizedBox(
                  height: 10,
                ),
                Expanded(
                  flex: 9,
                  child: mobileUserList(),
                )
              ],
            ),
            Positioned(
              bottom: 5,
              left: 0,
              right: 0,
              child: Container(
                margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                height: 60,
                // width: Get.width * 0.8,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(30),
                    color: ColorConstants.primaryColor),
                child: Center(
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Expanded(
                        child: InkWell(
                          onTap: () {
                            Navigator.of(context)
                                .pushReplacement(MaterialPageRoute(
                                    builder: (context) => HomeView(
                                          selectedIndex: 0,
                                        )));
                          },
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Icon(
                                Icons.home,
                                color: Colors.white,
                              ),
                              SizedBox(
                                height: 3,
                              ),
                              Text(
                                'Home',
                                style: TextStyle(color: Colors.white),
                              )
                            ],
                          ),
                        ),
                      ),
                      SizedBox(
                        height: 60,
                        width: 0.5,
                        child: Container(
                          color: Colors.white,
                        ),
                      ),
                      Expanded(
                        child: InkWell(
                          onTap: () {
                            Get.to(() => AddStaffView(
                                  location: false,
                                ));
                          },
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Icon(
                                Icons.person_add,
                                color: Colors.white,
                              ),
                              SizedBox(
                                height: 3,
                              ),
                              Text(
                                'Add User',
                                style: TextStyle(color: Colors.white),
                              )
                            ],
                          ),
                        ),
                      ),
                      SizedBox(
                        height: 60,
                        width: 0.5,
                        child: Container(
                          color: Colors.white,
                        ),
                      ),
                      Expanded(
                        child: InkWell(
                          onTap: () {
                           Get.to(HomeView(selectedIndex: 3));
                          },
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Icon(
                                Icons.more_horiz,
                                color: Colors.white,
                              ),
                              SizedBox(
                                height: 3,
                              ),
                              Text(
                                'More',
                                style: TextStyle(color: Colors.white),
                              )
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  Widget mobileUserList() {
    return GetBuilder<StaffsController>(initState: (_) {
      staffsController.shimmer = true;
      staffsController.getStaffs();
    }, builder: (controller) {
      return Container(
        margin: const EdgeInsets.only(
          left: 10.0,
          right: 10,
        ),
        child:
            !controller.shimmer && controller.getStaff.isEmpty
                ? Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Image(
                      height: 160,
                      width: 160,
                      image: AssetImage(AssetConstants.NoRecords),
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    Text(
                      "No users at this moment",
                      style: TextStyle(
                          color: Colors.grey[600], fontSize: 14),
                    ),
                  ],
                ))
                : controller.shimmer
                ? staffShimmer()
                :
            ListView.builder(
                padding: EdgeInsets.only(bottom: 80),
                itemCount: controller.getStaff.length,
                itemBuilder: (BuildContext context, int index) {
                  return Padding(
                    padding: const EdgeInsets.only(top: 12),
                    child: Stack(
                      children: [
                        Container(
                          decoration: BoxDecoration(
                            color: ColorConstants.secondaryColor,
                            boxShadow: [BoxShadow(color: Colors.grey)],
                            borderRadius: BorderRadius.all(Radius.circular(3)),
                          ),
                          height: 120,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Stack(
                                children: [
                                  Container(
                                    width: Get.width*0.22,
                                    decoration: BoxDecoration(
                                      color:
                                          UtilityPromotion.getLightColors(
                                                  '${controller.getStaff[index].firstname?[0]}'.toString())
                                              .withAlpha(100),
                                      shape: BoxShape.rectangle,
                                    ),
                                    child: Column(
                                      mainAxisAlignment:
                                          MainAxisAlignment.center,
                                      children: [
                                        Container(
                                          // width: 55,
                                          // height: 60,
                                          child: CircleAvatar(
                                              backgroundColor:
                                                  Colors.white70,
                                              radius: 30,
                                              child: Text(
                                                "${controller.getStaff[index].firstname?[0].toString().toUpperCase()}",
                                                style: TextStyle(
                                                    color: Colors.black54,
                                                    fontSize: 22),
                                              )),
                                        ),


                                      ],
                                    ),
                                  ),
                                  Positioned(
                                    bottom: 26,
                                    right: 12,
                                    child: GestureDetector(
                                      onTap: () {
                                        Get.to(UpdateStaff(staffData:controller.getStaff[index]));
                                      },
                                      child: Container(
                                        decoration: BoxDecoration(
                                          color:
                                              ColorConstants.primaryColor,
                                          shape: BoxShape.circle,
                                          // borderRadius: BorderRadius.circular(12),
                                        ),
                                        child: Padding(
                                          padding:
                                              const EdgeInsets.symmetric(
                                                  vertical: 6,
                                                  horizontal: 6),
                                          child: Icon(
                                            Icons.edit,
                                            color: Colors.white,
                                            size: 16,
                                          ),
                                        ),
                                      ),
                                    ),
                                  )
                                ],
                              ),
                              SizedBox(
                                width: 10,
                              ),
                              Expanded(
                                  flex: 8,
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceEvenly,
                                    children: [
                                      // SizedBox(
                                      //   height: 4,
                                      // ),
                                      Row(
                                        children: [
                                          Icon(
                                            Icons.person,
                                            color: ColorConstants.primaryColor,
                                            size: 20,
                                          ),
                                          SizedBox(
                                            width: 5,
                                          ),
                                          Row(
                                            children: [
                                              Text(
                                                "${controller.getStaff[index].firstname}",
                                                style: TextStyle(
                                                    fontSize: 16,
                                                    color: Colors.grey[600],
                                                    fontWeight:
                                                        FontWeight.w600),
                                              ),
                                              SizedBox(
                                                width: 10,
                                              ),
                                              // users[index]['Roleid']==1?
                                              // Icon(
                                              //   Icons
                                              //       .admin_panel_settings_outlined,
                                              //   color:
                                              //       ColorConstants.primaryColor,
                                              //   size: 20,
                                              // )
                                              // : users[index]['Roleid']==2?Icon(Icons.phone_android,color:ColorConstants.primaryColor,size:20,):
                                              // Icon(Icons.laptop_windows,color:ColorConstants.primaryColor,size:20,)
                                            ],
                                          ),
                                        ],
                                      ),
                                      Row(
                                        children: [
                                          Icon(
                                            Icons.phone,
                                            color: ColorConstants.primaryColor,
                                            size: 20,
                                          ),
                                          SizedBox(
                                            width: 5,
                                          ),
                                          Text(
                                            '+91 ${controller.getStaff[index].contactno}',
                                            style: TextStyle(
                                                fontSize: 15,
                                                color: Colors.black54,
                                                fontWeight: FontWeight.w400),
                                          ),
                                        ],
                                      ),
                                      Row(
                                        children: [
                                          Container(
                                            height: 30,
                                            padding: EdgeInsets.only(right: 10,),

                                            decoration: BoxDecoration(
                                                color: ColorConstants.primaryColor,
                                                border: Border.all(
                                                    color: ColorConstants.primaryColor)),
                                            child: Row(
                                              children: [
                                                Container(
                                                  padding: EdgeInsets.symmetric(
                                                      horizontal: 10),
                                                  height: 30,
                                                  decoration: BoxDecoration(
                                                      color: Colors.white),
                                                  child: Icon(
                                                    Icons.business,
                                                    color: ColorConstants.primaryColor,
                                                    size: 18,
                                                  ),
                                                ),
                                                SizedBox(
                                                  width: 10,
                                                ),
                                                Text(
                                                  '${controller.getStaff[index].locationname}',
                                                  style: TextStyle(
                                                      fontSize: 15,
                                                      color: Colors.white,
                                                      fontWeight:
                                                      FontWeight.w400),
                                                ),

                                              ],
                                            ),
                                          ),
                                        ],
                                      ),

                                    ],
                                  )),
                            ],
                          ),
                        ),
                      ],
                    ),
                  );
                }),
      );
    });
  }

  staffShimmer() {
    return Shimmer.fromColors(
      enabled: true,
      child: ListView.builder(
          padding: EdgeInsets.only(bottom: 60, top: 10),
          itemCount: 4,
          itemBuilder: (BuildContext context, int index) {
            return InkWell(
              child: Container(
                margin: EdgeInsets.only(bottom: 10),
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey[400]!, width: 2),
                  borderRadius: BorderRadius.all(Radius.circular(3)),
                ),
                height: 90,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Expanded(
                        flex: 3,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Container(
                              width: 55,
                              height: 55,
                              child: CircleAvatar(
                                  backgroundColor:
                                      ColorConstants.secondaryColor,
                                  child: Text(
                                    "",
                                    style: TextStyle(
                                        color: ColorConstants.secondaryColor,
                                        fontSize: 22),
                                  )),
                            ),
                          ],
                        )),
                    Expanded(
                        flex: 8,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            SizedBox(
                              height: 4,
                            ),
                            Expanded(
                              flex: 2,
                              child: Row(
                                children: [
                                  Icon(
                                    Icons.person,
                                    color: ColorConstants.secondaryColor,
                                    size: 20,
                                  ),
                                  SizedBox(
                                    width: 5,
                                  ),
                                  Text(
                                    "--------------",
                                    style: TextStyle(
                                        fontSize: 16,
                                        color: Colors.grey[600],
                                        fontWeight: FontWeight.w600),
                                  ),
                                ],
                              ),
                            ),
                            Expanded(
                              flex: 2,
                              child: Row(
                                children: [
                                  Icon(
                                    Icons.phone,
                                    color: ColorConstants.primaryColor,
                                    size: 20,
                                  ),
                                  SizedBox(
                                    width: 5,
                                  ),
                                  Text(
                                    '-----------',
                                    style: TextStyle(
                                        fontSize: 15,
                                        color: Colors.black54,
                                        fontWeight: FontWeight.w400),
                                  ),
                                ],
                              ),
                            ),
                            Expanded(
                              flex: 2,
                              child: Row(
                                children: [
                                  Expanded(
                                      // flex: 5,
                                      child: Row(
                                    children: [
                                      Icon(
                                        Icons.store,
                                        color: ColorConstants.primaryColor,
                                        size: 20,
                                      ),
                                      SizedBox(
                                        width: 3,
                                      ),
                                      Text(
                                        '-----------',
                                        // '',
                                        style: TextStyle(
                                            fontSize: 15,
                                            color: Colors.black54,
                                            fontWeight: FontWeight.w400),
                                      ),
                                      SizedBox(
                                        width: 5,
                                      ),
                                    ],
                                  )),
                                ],
                              ),
                            ),
                            SizedBox(
                              height: 4,
                            ),
                          ],
                        )),
                    Expanded(
                      flex: 1,
                      child: Center(
                        child: Icon(
                          Icons.arrow_forward_ios,
                          color: Colors.grey[600],
                          size: 16,
                        ),
                      ),
                    )
                  ],
                ),
              ),
            );
          }),
      baseColor: Colors.grey[300]!,
      highlightColor: Colors.grey[100]!,
    );
  }
}
