import 'dart:io';

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:wow_english/common/extension/string_extension.dart';
import 'package:wow_english/common/widgets/ow_image_widget.dart';
import 'package:wow_english/common/widgets/we_app_bar.dart';
import 'package:wow_english/pages/user/bloc/user_bloc.dart';
import 'package:wow_english/pages/user/modify/user_avatar_bloc/user_avatar_bloc.dart';
import 'package:wow_english/route/route.dart';
import 'package:wow_english/utils/toast_util.dart';

import 'modify_user_information_page.dart';

class ModifyUserAvatarPage extends StatelessWidget {
  const ModifyUserAvatarPage({super.key, required this.pageType});

  /// 0 新用户设置头像 1 修改头像
  final int pageType;

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => UserAvatarBloc(),
      child: _ModifyUserAvatarPage(pageType: pageType),
    );
  }
}

class _ModifyUserAvatarPage extends StatelessWidget {
  const _ModifyUserAvatarPage({required this.pageType});
  final int pageType;

  @override
  Widget build(BuildContext context) {
    return MultiBlocListener(
      listeners: [
        BlocListener<UserBloc,UserState>(
            listener: (context, state){
              if (state is UserInfoUpdated) {
                if (pageType == 1) {
                  showToast('修改成功');
                  popPage();
                } else {
                  context.read<UserAvatarBloc>().add(ChangeUserEnterAppStateEvent());
                }
              }
            }),
        BlocListener<UserAvatarBloc,UserAvatarState>(
          listener: (context,state){
            if (state is ChangeImageState) {
              context.read<UserBloc>().add(UserUpdate(ModifyUserInformationType.avatar,state.imageUrl));
            }
          },)
      ],
      child: pageType == 0 ? _setUserAvatarView():_modifyUserAvatarPageView(),
    );
  }

  ///个人信息修改头像
  Widget _modifyUserAvatarPageView() => BlocBuilder<UserAvatarBloc,UserAvatarState>(
      builder: (context,state){
        return Scaffold(
          appBar:const WEAppBar(
            titleText: '头像修改',
          ),
          body: SafeArea(
            child: Column(
              children: [
                20.verticalSpace,
                _avatarImageWidget(),
              ],
            ),
          ),
        );
      });

  ///新用户设置头像
  Widget _setUserAvatarView() => BlocBuilder<UserAvatarBloc,UserAvatarState>(
    builder: (context, state) {
      final bloc = BlocProvider.of<UserAvatarBloc>(context);
      return Container(
        color: Colors.white,
        child: SafeArea(
          child: Column(
            children: [
              20.verticalSpace,
              Row(
                children: [
                  Image.asset(
                    'wow_logo'.assetPng,
                    height: 49.h,
                    width: 84.w,
                  ),
                  Text(
                    '欢迎登录wow english\n接下来请填写一下您的个人信息吧',
                    textAlign: TextAlign.left,
                    style: TextStyle(
                        fontSize: 17.sp,
                        color: const Color(0xFF666666)
                    ),
                  )
                ],
              ),
              15.verticalSpace,
              _avatarImageWidget(),
              10.verticalSpace,
              Container(
                width: 176.w,
                height: 52.h,
                padding: const EdgeInsets.all(5),
                decoration: BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage(bloc.canInsertApp?'oninto'.assetPng:'intowow'.assetPng),
                        fit: BoxFit.fill
                    )
                ),
                alignment: Alignment.center,
                child: Text(
                  '进入wow english',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                      fontSize: 12.sp,
                      color: Colors.white
                  ),
                ),
              )
            ],
          ),
        ),
      );
    }
  );

  Widget _avatarImageWidget() => BlocBuilder<UserAvatarBloc,UserAvatarState>(
      builder: (context, state){
        final bloc = BlocProvider.of<UserAvatarBloc>(context);
        return Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
              width: 205.w,
              height: 197.h,
              padding: const EdgeInsets.all(5),
              decoration: BoxDecoration(
                  image: DecorationImage(
                      image: AssetImage('video_background'.assetPng),
                      fit: BoxFit.fill
                  )
              ),
              child: bloc.file == null ?
              OwImageWidget(name: bloc.imageUrl):
              Image.file(
                File(bloc.file!.path),
                fit: BoxFit.fill,
              ),
            ),
            54.horizontalSpace,
            Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  onTap: () => bloc.add(GetImageFromCameraEvent()),
                  child: Container(
                    width: 222.w,
                    height: 65.h,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                        image: DecorationImage(
                            image: AssetImage('alter'.assetPng),
                            fit: BoxFit.fill
                        )
                    ),
                    child: Text(
                      '拍照修改头像',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 20.sp
                      ),
                    ),
                  ),
                ),
                20.verticalSpace,
                GestureDetector(
                  onTap: () => bloc.add(GetImageFromPhotoEvent()),
                  child: Container(
                    width: 222.w,
                    height: 65.h,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                        image: DecorationImage(
                            image: AssetImage('alter'.assetPng),
                            fit: BoxFit.fill
                        )
                    ),
                    child: Text(
                      '从相册选择',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 20.sp
                      ),
                    ),
                  ),
                )
              ],
            )
          ],
        );
      });
}