import 'package:cs_resources/constants/color_constants.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:shared/utils/date_time_utils.dart';
import 'package:shared/utils/screen_util.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/load_state_layout.dart';
import 'package:widgets/my_appbar.dart';
import 'package:widgets/my_text_view.dart';

import 'report_staff_request_controller.dart';

import 'package:plugin_basic/base/base_stateless_page.dart';
import 'package:plugin_basic/utils/ext_get_nav.dart';
import 'package:router/path/router_path.dart';

import 'report_staff_request_item.dart';
import 'report_staff_request_state.dart';

/*
 * 兼容新加坡与越南的展示，不同的国家调用不同的接口统一展示一样的样式
 */
class ReportStaffRequestPage extends BaseStatelessPage<ReportStaffRequestController> {
  ReportStaffRequestPage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance() {
    return Get.start(RouterPath.reportStaffRequestSG);
  }

  late ReportStaffRequestState state;

  @override
  void initState() {
    state = controller.state;
  }

  @override
  ReportStaffRequestController createRawController() {
    return ReportStaffRequestController();
  }

  @override
  Widget buildWidget(BuildContext context) {
    return autoCtlGetBuilder(builder: (controller) {
      return Scaffold(
        extendBodyBehindAppBar: true,
        appBar: MyAppBar.appBar(context, "Monthly Staff Request Report22".tr),
        body: SafeArea(
        bottom: MediaQuery.of(context).padding.bottom > 38,
          top: false,
          child: Container(
            width: double.infinity,
            height: double.infinity,
            padding: EdgeInsets.only(top: kToolbarHeight + ScreenUtil.getStatusBarH(context) + 1),
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                colors: [
                  Color(0xFF091D44),
                  Color(0xFF245A8A),
                  Color(0xFF7F7CEC),
                ],
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
              ),
            ),
            child: Column(
              children: [
                // 时间筛选
                Container(
                    width: double.infinity,
                    height: 36,
                    margin: const EdgeInsets.symmetric(vertical: 10, horizontal: 15),
                    decoration: BoxDecoration(
                      color: const Color(0xFF4DCFF6).withOpacity(0.2), // 设置背景颜色和不透明度
                      borderRadius: BorderRadius.circular(20.0), // 设置圆角
                    ),
                    child: Row(
                      children: [
                        MyTextView(
                          DateTimeUtils.formatDate(state.startDateTime, format: "yyyy-MM-dd"),
                          hint: "Start Date".tr,
                          textHintColor: ColorConstants.textGrayAECAE5,
                          fontSize: 15,
                          textAlign: TextAlign.center,
                          isFontRegular: true,
                          onClick: controller.pickerStartDate,
                          textColor: ColorConstants.textGrayAECAE5,
                        ).expanded(),
                        Container(color: ColorConstants.dividerBar, height: 21.5, width: 0.5),
                        MyTextView(
                          DateTimeUtils.formatDate(state.endDateTime, format: "yyyy-MM-dd"),
                          hint: "End Date".tr,
                          textHintColor: ColorConstants.textGrayAECAE5,
                          fontSize: 15,
                          textAlign: TextAlign.center,
                          isFontRegular: true,
                          onClick: controller.pickerEndDate,
                          textColor: ColorConstants.textGrayAECAE5,
                        ).expanded(),
                      ],
                    )),

                //动态列表
                LoadStateLayout(
                  state: controller.loadingState,
                  errorMessage: controller.errorMessage,
                  errorRetry: () {
                    controller.retryRequest();
                  },
                  successSliverWidget: [
                    SliverPadding(
                      padding: const EdgeInsets.only(left: 15, right: 15, bottom: 15),
                      sliver: DecoratedSliver(
                        decoration: BoxDecoration(
                          color: const Color(0xFF4DCFF6).withOpacity(0.2), // 设置背景颜色和不透明度
                          borderRadius: BorderRadius.circular(5), // 设置圆角
                        ),
                        sliver: SliverList(
                          delegate: SliverChildBuilderDelegate(
                            (context, index) {
                              if (index == 0) {
                                return const SizedBox(height: 16); // 添加顶部间距
                              } else if (index == state.datas.length + 1) {
                                return const SizedBox(height: 20); // 添加底部间距
                              } else {
                                return ReportStaffRequestItem(item: state.datas[index - 1]); // 注意这里的 index - 1
                              }
                            },
                            childCount: state.datas.length + 2,
                          ),
                        ),
                      ),
                    ),
                  ],
                ).expanded(),
              ],
            ),
          ),
        ),
      );
    });
  }
}
