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

import '../../../../appRouters.dart';
import '../../../../app_settings/app_colors.dart';
import '../../../../tools/submitBtn.dart';
import '../../../../tools/titleAppBar.dart';
import '../../../../translations/trans_lib.dart';
import '../valueAddedServicesAddSMSTemplate/valueAddedServicesAddSMSTemplate_page.dart';

class ValueAddedServicesListSMSTemplatePage extends StatefulWidget {
  const ValueAddedServicesListSMSTemplatePage({Key? key}) : super(key: key);

  @override
  State<ValueAddedServicesListSMSTemplatePage> createState() =>
      _ValueAddedServicesListSMSTemplatePageState();
}

class _ValueAddedServicesListSMSTemplatePageState
    extends State<ValueAddedServicesListSMSTemplatePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.mainBackgroundColor,
      appBar: TitleAppBar(
          barTitle: TranslationLoader.lanKeys!.customSMSTemplate!.tr,
          haveBack: true,
          backgroundColor: AppColors.mainColor),
      body: Column(
        children: [
          _topTipWidget(),
          Expanded(child: _buildMainUI()),
          SubmitBtn(
              btnName: TranslationLoader.lanKeys!.creatingANewTemplate!.tr,
              borderRadius: 20.w,
              margin: EdgeInsets.only(
                  left: 30.w, right: 30.w, top: 30.w, bottom: 30.w),
              padding: EdgeInsets.only(top: 25.w, bottom: 25.w),
              onClick: () {
                Navigator.pushNamed(
                    context, Routers.valueAddedServicesAddSMSTemplatePage);
              }),
          SizedBox(
            height: 40.h,
          )
        ],
      ),
    );
  }

  Widget _topTipWidget() {
    return Container(
        margin: EdgeInsets.only(top: 20.w, left: 20.w, right: 20.w),
        padding:
            EdgeInsets.only(top: 20.h, left: 20.w, right: 20.w, bottom: 20.h),
        decoration: BoxDecoration(
            color: Colors.white, borderRadius: BorderRadius.circular(5)),
        child: Column(
          children: [
            Text(
              TranslationLoader.lanKeys!.customTemplatesTip!.tr,
              style: TextStyle(
                  fontSize: 22.sp,
                  color: AppColors.blackColor,
                  fontWeight: FontWeight.w600),
            ),
            SizedBox(
              height: 15.h,
            ),
            Container(
              padding: EdgeInsets.only(
                  top: 15.h, left: 15.w, right: 15.w, bottom: 15.h),
              decoration: BoxDecoration(
                  color: const Color(0xFFFbF9EC),
                  borderRadius: BorderRadius.circular(10.h)),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Container(
                    width: 1.sw - 15.w * 2 - 40.w * 2 - 140.w,
                    // margin: EdgeInsets.only(top:15.h, left: 15.w, right: 15.w, bottom: 15.h),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          "${TranslationLoader.lanKeys!.currentState!.tr}：${TranslationLoader.lanKeys!.onTrial!.tr}",
                          style: TextStyle(
                              fontSize: 20.sp, fontWeight: FontWeight.w600),
                        ),
                        Text(TranslationLoader.lanKeys!.unHaveOpenedTip2!.tr,
                            style: TextStyle(
                                fontSize: 20.sp, fontWeight: FontWeight.w600))
                      ],
                    ),
                  ),
                  GestureDetector(
                    onTap: () {
                      Navigator.pushNamed(
                          context, Routers.valueAddedServicesHighFunctionPage);
                    },
                    child: Container(
                        width: 100.w,
                        height: 50.h,
                        decoration: BoxDecoration(
                            color: const Color(0xFFCAB68D),
                            borderRadius: BorderRadius.circular(35.h)),
                        child: Center(
                            child: Text(
                                TranslationLoader.lanKeys!.goToTheOpen!.tr,
                                textAlign: TextAlign.center,
                                style: TextStyle(
                                    color: Colors.white, fontSize: 20.sp)))),
                  ),
                ],
              ),
            )
          ],
        ));
  }

  Widget _buildMainUI() {
    return ListView.builder(
        itemCount: 10,
        itemBuilder: (c, index) {
          return _valueAddedServicesListSMSTemplateItem(
              'images/icon_lock.png', "张三", () {
            // Navigator.pushNamed(context, Routers.valueAddedServicesAddSMSTemplatePage);
          });
        });
  }

  Widget _valueAddedServicesListSMSTemplateItem(
      String title, String content, Function() action) {
    return GestureDetector(
      onTap: action,
      child: Container(
        // height: 100.h,
        margin: EdgeInsets.only(left: 20.w, right: 20.w, top: 20.w),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(10.w),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: EdgeInsets.only(left: 30.h, top: 30.h, bottom: 20.h),
              child: Text(
                "101",
                style: TextStyle(fontSize: 24.sp, fontWeight: FontWeight.w600),
              ),
            ),
            Container(
              margin: EdgeInsets.only(left: 25.w, right: 25.w, bottom: 25.h),
              decoration: BoxDecoration(
                color: const Color(0xFFF5F5F5),
                borderRadius: BorderRadius.circular(10.h),
              ),
              child: Padding(
                  padding: EdgeInsets.only(
                      left: 20.w, top: 20.h, right: 20.w, bottom: 20.h),
                  child: RichText(text: electronicKeySpan)),
            ),
          ],
        ),
      ),
    );
  }
}