import 'package:electronic_assistant/base/base_page.dart';
import 'package:electronic_assistant/data/bean/template_bean.dart';
import 'package:electronic_assistant/utils/expand.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';

import '../../../resource/assets.gen.dart';
import '../../../resource/colors.gen.dart';
import '../../../resource/string.gen.dart';
import '../../../router/app_pages.dart';
import '../../../utils/common_style.dart';
import 'controller.dart';

class TemplateDetailPage extends BasePage<TemplateDetailController> {
  const TemplateDetailPage({super.key});

  static Future<dynamic> start(TemplateBean bean) async {
    return Get.toNamed(RoutePath.templateDetail, arguments: bean);
  }

  @override
  bool immersive() {
    return true;
  }

  @override
  Widget buildBody(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        controller.onBack();
        return false;
      },
      child: Scaffold(
        backgroundColor: '#F6F6F6'.color,
        appBar: _buildAppBar(),
        body: Column(
          children: [
            Expanded(child: _buildTemplateList()),
            _buildTemplateBtn()
          ],
        ),
      ),
    );
  }

  Widget _buildTemplateBtn() {
    return Obx(() {
      return Visibility(
        visible: controller.templateBean != null,
        child: GestureDetector(
          onTap: () {
            controller.onUpdateTemplate();
          },
          child: Center(
            child: Obx(() {
              return Opacity(
                opacity:
                    controller.templateBean?.isDefaultTemp == true ? 0.4 : 1,
                child: Container(
                  margin: EdgeInsets.only(bottom: 16.w),
                  decoration: getCommonDecoration(8.w),
                  width: 328.w,
                  height: 48.w,
                  child: Center(
                    child: Text(
                      StringName.templateDetailUpdate.tr,
                      style: TextStyle(fontSize: 16.sp, color: ColorName.white),
                    ),
                  ),
                ),
              );
            }),
          ),
        ),
      );
    });
  }

  Widget _buildTemplateList() {
    return Obx(() {
      return ListView.builder(
        padding: EdgeInsets.only(top: 12.w),
        itemCount: controller.templateTitle.length,
        itemBuilder: (context, index) {
          return _buildTemplateItem(controller.templateTitle[index]);
        },
      );
    });
  }

  Widget _buildTemplateItem(String title) {
    return Container(
      decoration: BoxDecoration(
          color: ColorName.white, borderRadius: BorderRadius.circular(8.w)),
      padding: EdgeInsets.only(left: 16.w, right: 12.w),
      margin: EdgeInsets.only(bottom: 8.h, left: 12.w, right: 12.w),
      child: Padding(
        padding: EdgeInsets.symmetric(vertical: 20.w),
        child: Text(title,
            style: TextStyle(
                fontSize: 15.sp, color: ColorName.primaryTextColor, height: 1)),
      ),
    );
  }

  AppBar _buildAppBar() {
    return AppBar(
      scrolledUnderElevation: 0,
      systemOverlayStyle: SystemUiOverlayStyle.dark,
      backgroundColor: Colors.transparent,
      title: Obx(() {
        return Text(
          controller.templateBean?.name ?? '',
          style: TextStyle(fontSize: 17.sp, color: ColorName.primaryTextColor),
        );
      }),
      centerTitle: true,
      leading: IconButton(
          onPressed: () {
            controller.onBack();
          },
          icon: SizedBox(
              width: 24.w,
              height: 24.w,
              child: Assets.images.iconBack.image())),
    );
  }
}
