import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sk_base_mobile/screens/mine/mine.controller.dart';
// import 'package:sk_base_mobile/screens/mine/mine_about.dart';
// import 'package:sk_base_mobile/screens/mine/mine_block.dart';
// import 'package:sk_base_mobile/screens/mine/mine_mytickets.dart';
// import 'package:sk_base_mobile/screens/mine/mine_settings.dart';
import 'package:sk_base_mobile/services/service.dart';
import 'package:sk_base_mobile/store/auth.store.dart';
import 'package:sk_base_mobile/util/common.util.dart';
import 'package:sk_base_mobile/util/screen_adaper_util.dart';
import 'package:sk_base_mobile/widgets/want_keep_alive.dart';
import 'package:sk_base_mobile/widgets/my_avatar.dart';
import 'package:sk_base_mobile/app_theme.dart';
import 'package:sk_base_mobile/constants/router.dart';
import '../../constants/constants.dart';

class MinePage extends StatefulWidget {
  MinePage({super.key});

  @override
  State<MinePage> createState() => _MinePageState();
}

class _MinePageState extends State<MinePage>
    with SingleTickerProviderStateMixin {
  final _controller = Get.put<MineController>(MineController());

  @override
  void initState() {
    super.initState();
    _controller.tabController ??= TabController(
        initialIndex: _controller.selectedTabIndex.value,
        length: 4,
        vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return _buildBody();
  }

  Widget _buildBody() {
    return Column(mainAxisSize: MainAxisSize.max, children: [
      Container(
        height: ScreenAdaper.height(360),
        width: ScreenAdaper.screenWidth(),
        decoration: const BoxDecoration(
            image: DecorationImage(
                fit: BoxFit.cover,
                image: AssetImage('assets/images/mine_bg.png'))),
        child: Padding(
          padding: EdgeInsets.symmetric(
              horizontal: ScreenAdaper.width(20),
              vertical: ScreenAdaper.height(20)),
          child: Column(children: [
            SizedBox(
              height: ScreenAdaper.height(30),
            ),
            Row(
              children: [
                const Spacer(),
                Container(
                  height: ScreenAdaper.width(40),
                  width: ScreenAdaper.width(40),
                  padding: EdgeInsets.all(ScreenAdaper.width(2)),
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(ScreenAdaper.sp(40)),
                      color: const Color(0xFF000000).withOpacity(0.3)),
                  child: const SizedBox(),
                )
              ],
            ),
            SizedBox(
              height: ScreenAdaper.height(120),
            ),
            Row(
              children: [
                Expanded(
                    child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Obx(() => Text(
                              AuthStore.to.userInfo.value.nickname ?? '',
                              style: TextStyle(
                                  fontSize: ScreenAdaper.sp(20),
                                  fontWeight: FontWeight.w400),
                            )),
                        SizedBox(
                          width: ScreenAdaper.width(3),
                        ),
                        InkWell(
                          onTap: () {
                            Get.toNamed(RouteConfig.userinfo);
                          },
                          child: Image(
                            image:
                                const AssetImage('assets/images/edit_icon.png'),
                            height: ScreenAdaper.width(20),
                          ),
                        )
                      ],
                    ),
                    SizedBox(
                      height: ScreenAdaper.height(15),
                    ),
                    Text(StorageService.to.getString(CacheKeys.deviceUUID) ??
                        ''),
                    Row(
                      children: [
                        SizedBox(
                          width: ScreenAdaper.width(210),
                          child: Text(
                            'ID: ${AuthStore.to.userInfo.value.userId}',
                            overflow: TextOverflow.ellipsis,
                            maxLines: 2,
                            style: TextStyle(
                                fontSize: ScreenAdaper.sp(16),
                                color: Colors.grey[500]),
                          ),
                        ),
                        InkWell(
                          onTap: () {},
                          child: Container(
                              alignment: Alignment.topCenter,
                              width: ScreenAdaper.width(50),
                              height: ScreenAdaper.height(30),
                              padding: EdgeInsets.symmetric(
                                  horizontal: ScreenAdaper.width(5)),
                              decoration: BoxDecoration(
                                  color: const Color(0xFF454545),
                                  borderRadius: BorderRadius.circular(5)),
                              child: Text('copy',
                                  style: TextStyle(
                                      color: AppTheme.white,
                                      fontSize: ScreenAdaper.sp(16)))),
                        )
                      ],
                    )
                  ],
                )),
                MyAvatarWidget()
              ],
            )
          ]),
        ),
      ),
      Expanded(
          child: DefaultTabController(
              length: 4,
              initialIndex: _controller.selectedTabIndex.value,
              child: Scaffold(
                  backgroundColor: AppTheme.white,
                  appBar: AppBar(
                    backgroundColor: AppTheme.white,
                    elevation: 0,
                    automaticallyImplyLeading: false,
                    flexibleSpace: _buildTabBar(),
                  ),
                  body: _buildTabView())))
    ]);
  }

  Widget _buildTabBar() {
    final tabs = _controller.mineTabs
        .asMap()
        .map((index, item) {
          return MapEntry(
              index,
              Obx(
                () => Tab(
                    child: Image(
                        image: AssetImage(
                            'assets/images/$item${_controller.selectedTabIndex.value == index ? '_active' : ''}.png'))),
              ));
        })
        .values
        .toList();

    return Container(
      margin: EdgeInsets.only(top: ScreenAdaper.height(20)),
      padding: EdgeInsets.symmetric(vertical: ScreenAdaper.height(10)),
      decoration: const BoxDecoration(
          border: Border.symmetric(
              horizontal: BorderSide(color: Color(0xFFCCCCCC)))),
      child: TabBar(
        controller: _controller.tabController,
        tabs: tabs,
        indicator: const BoxDecoration(),
        onTap: (index) {
          _controller.selectedTabIndex.value = index;
        }, /*  */
      ),
    );
  }

  Widget _buildTabView() {
    return TabBarView(
      controller: _controller.tabController,
      physics: const NeverScrollableScrollPhysics(),
      children: [
        SizedBox(),
        SizedBox(),
        SizedBox(),
        SizedBox(),
      ],
    );
  }
}