import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:yumi/ui_kit/components/sc_compontent.dart';
import 'package:yumi/ui_kit/components/text/sc_text.dart';
import 'package:yumi/app/constants/sc_global_config.dart';
import 'package:yumi/modules/store/store_route.dart';
import 'package:yumi/modules/store/theme/store_theme_page.dart';
import 'package:provider/provider.dart';
import 'package:tancent_vap/utils/constant.dart';
import 'package:tancent_vap/widgets/vap_view.dart';
import 'package:yumi/app_localizations.dart';
import 'package:yumi/ui_kit/components/appbar/socialchat_appbar.dart';
import 'package:yumi/app/routes/sc_fluro_navigator.dart';
import 'package:yumi/shared/tools/sc_path_utils.dart';
import 'package:yumi/shared/data_sources/sources/local/file_cache_manager.dart';
import 'package:yumi/services/auth/user_profile_manager.dart';
import 'package:yumi/ui_kit/widgets/headdress/headdress_widget.dart';
import 'package:yumi/modules/wallet/wallet_route.dart';
import 'package:yumi/modules/store/chatbox/store_chatbox_page.dart';
import 'package:yumi/modules/store/headdress/store_headdress_page.dart';
import 'package:yumi/modules/store/mountains/store_mountains_page.dart';

import '../../shared/business_logic/usecases/sc_fixed_width_tabIndicator.dart';

class StorePage extends StatefulWidget {
  @override
  _StorePageState createState() => _StorePageState();
}

class _StorePageState extends State<StorePage>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;
  final List<Widget> _pages = [];
  final List<Widget> _tabs = [];
  Timer? _timer;

  @override
  void initState() {
    super.initState();
    _pages.add(StoreHeaddressPage());
    _pages.add(
      StoreMountainsPage(),
    );
    _pages.add(
      StoreThemePage(),
    );
    _pages.add(StoreChatboxPage());
    _tabController = TabController(length: _pages.length, vsync: this);
    _tabController.addListener(() {
    });
    Provider.of<SocialChatUserProfileManager>(context, listen: false).balance();
  }

  @override
  void dispose() {
    super.dispose();
    _timer?.cancel();
  }

  @override
  Widget build(BuildContext context) {
    _tabs.clear();
    _tabs.add(Tab(text: SCAppLocalizations.of(context)!.headdress));
    _tabs.add(Tab(text: SCAppLocalizations.of(context)!.mountains));
    _tabs.add(Tab(text: SCAppLocalizations.of(context)!.theme));
    _tabs.add(Tab(text: SCAppLocalizations.of(context)!.chatBox));
    return Stack(
      children: [
        Image.asset(
          SCGlobalConfig.businessLogicStrategy.getLanguagePageBackgroundImage(),
          width: ScreenUtil().screenWidth,
          height: ScreenUtil().screenHeight,
          fit: BoxFit.fill,
        ),
        Scaffold(
          backgroundColor: Colors.transparent,
          resizeToAvoidBottomInset: false,
          appBar: SocialChatStandardAppBar(
            title: SCAppLocalizations.of(context)!.store,
            actions: [
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                child: Container(
                  padding: EdgeInsets.all(5.w),
                  margin: EdgeInsetsDirectional.only(
                    end:
                    SCGlobalConfig.businessLogicStrategy
                        .getStorePageShoppingBagMargin()
                        .end
                        .w,
                  ),
                  child: Image.asset(
                    SCGlobalConfig.businessLogicStrategy
                        .getStorePageShoppingBagIcon(),
                    width: 20.w,
                    height: 20.w,
                  ),
                ),
                onTap: () {
                  SCNavigatorUtils.push(
                    context,
                    StoreRoute.bags,
                    replace: true,
                  );
                },
              ),
            ],
          ),
          body: SafeArea(
            top: false,
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    TabBar(
                      tabAlignment: TabAlignment.center,
                      isScrollable: true,
                      labelColor: Colors.white,
                      unselectedLabelStyle: SCGlobalConfig.businessLogicStrategy
                          .getStorePageTabUnselectedLabelStyle()
                          .copyWith(
                        fontSize:
                        SCGlobalConfig.businessLogicStrategy
                            .getStorePageTabUnselectedLabelStyle()
                            .fontSize
                            ?.sp,
                      ),
                      // indicatorPadding: EdgeInsets.symmetric(
                      //   vertical: 5.w,
                      //   horizontal: 15.w,
                      // ),
                      indicator: SCFixedWidthTabIndicator(
                        width: 15.w,
                        color:
                        SCGlobalConfig.businessLogicStrategy
                            .getStorePageTabIndicatorColor(),
                      ),
                      dividerColor:
                      SCGlobalConfig.businessLogicStrategy
                          .getStorePageTabDividerColor(),
                      controller: _tabController,
                      tabs: _tabs,
                    ),
                  ],
                ),
                SizedBox(height: 5.w),
                Expanded(
                  child: TabBarView(
                    controller: _tabController,
                    children: _pages,
                  ),
                ),
                Consumer<SocialChatUserProfileManager>(
                  builder: (context, ref, child) {
                    return GestureDetector(
                      child: Container(
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                              topLeft: Radius.circular(12.w),
                              topRight: Radius.circular(12.w),
                            ),
                            color: Color(0xff18F2B1).withOpacity(0.1),
                      ),
                      padding: EdgeInsets.only(bottom: 12.w,top: 12.w),
                      child: Row(
                        children: [
                          SizedBox(width: 10.w),
                          Image.asset(
                            SCGlobalConfig.businessLogicStrategy
                                .getStorePageGoldIcon(),
                            width: 25.w,
                            height: 25.w,
                          ),
                          SizedBox(width: 5.w),
                          text(
                            "${ref.myBalance}",
                            fontSize: 14.sp,
                            textColor:
                            SCGlobalConfig.businessLogicStrategy
                                .getStorePageGoldTextColor(),
                          ),
                          SizedBox(width: 4.w),
                          Icon(
                            Icons.chevron_right,
                            size: 20.w,
                            color:
                            SCGlobalConfig.businessLogicStrategy
                                .getStorePageGoldIconColor(),
                          ),
                        ],
                      ),
                    ),
                    onTap: () {
                    SCNavigatorUtils.push(
                    context,
                    WalletRoute.recharge,
                    replace: false,
                    );
                    },
                    );
                  },
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}