import 'package:farm_tpf/presentation/custom_widgets/checkbox/checkbox_widget.dart';
import 'package:farm_tpf/presentation/screens/task/models/task_update_request.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/src/widgets/placeholder.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../themes/styles_text.dart';
import '../../custom_widgets/app_bar_widget.dart';
import '../../custom_widgets/button_widget.dart';
import '../../custom_widgets/loading_list_page.dart';
import '../../custom_widgets/textfield/text_field_normal.dart';
import '../codes/widgets/item_column.dart';
import 'cubit/task_detail_cubit.dart';
import 'package:farm_tpf/utils/formatter.dart';

class TaskDetailPage extends StatefulWidget {
  final int taskId;
  const TaskDetailPage({super.key, required this.taskId});

  @override
  State<TaskDetailPage> createState() => _TaskDetailPageState();
}

class _TaskDetailPageState extends State<TaskDetailPage> {
  var bloc = TaskDetailCubit();

  @override
  void initState() {
    super.initState();
    bloc.preparedData(widget.taskId);
  }

  @override
  void dispose() {
    bloc.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBarWidget(),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Column(
          children: [
            Expanded(
              child: BlocBuilder<TaskDetailCubit, TaskDetailState>(
                bloc: bloc,
                builder: (context, state) {
                  if (state is TaskDetailLoading) {
                    return Center(
                      child: LoadingListPage(),
                    );
                  } else if (state is TaskDetailFailure) {
                    return Center(child: Text(state.errorMessage));
                  } else if (state is TaskDetailSuccessful) {
                    return SingleChildScrollView(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          _itemTaskDetail(
                            title: '',
                            detail: state.task.title ?? '',
                            titleStyle: StylesText.body1,
                            detailStyle: StylesText.body1.copyWith(
                              color: Colors.blue,
                            ),
                          ),
                          _itemTaskDetail(title: 'Hạn chót : ', detail: state.task.dueDate?.format_DDMMYY().toString() ?? ''),
                          (state.task.isCompleted ?? false)
                              ? _itemTaskDetail(title: 'Thời gian hoàn thành : ', detail: state.task.executeDate?.format_DDMMYY().toString() ?? '')
                              : const SizedBox.shrink(),
                          Padding(
                            padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
                            child: Text(
                              'Mô tả công việc :',
                              style: StylesText.body2,
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
                            child: Text(
                              state.task.description ?? '',
                              style: StylesText.body3,
                            ),
                          ),
                          ValueListenableBuilder<bool>(
                            valueListenable: bloc.isCompleted,
                            builder: (context, isCompleted, _) {
                              return Padding(
                                padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
                                child: CheckboxWidget(
                                  title: 'Hoàn thành',
                                  style: StylesText.body2,
                                  isChecked: isCompleted,
                                  onChange: (status) {
                                    bloc.isCompleted.value = status;
                                    // bloc.updateStatusTask(
                                    //   RequestTaskUpdate(
                                    //     id: widget.taskId,
                                    //     completed: status,
                                    //   ),
                                    // );
                                  },
                                ),
                              );
                            },
                          ),
                          const SizedBox(
                            height: 8,
                          ),
                          ItemColumnWidget(
                            title: 'Mô tả công việc',
                            child: TextFieldNormal(
                              controller: bloc.detailCtl,
                              maxLines: 3,
                              hint: 'Mô tả',
                            ),
                          ),
                        ],
                      ),
                    );
                  }
                  return const SizedBox.shrink();
                },
              ),
            ),
            // const SizedBox(
            //   height: 8,
            // ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: ButtonWidget(
                title: 'Cập nhật hoàn thành',
                onPressed: () {
                  bloc.updateStatusTask(
                    RequestTaskUpdate(
                      id: widget.taskId,
                      completed: bloc.isCompleted.value,
                      completedDetail: bloc.detailCtl.text,
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _itemTaskDetail({
    required String title,
    required String detail,
    TextStyle? titleStyle,
    TextStyle? detailStyle,
  }) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            title,
            style: titleStyle ?? StylesText.body2,
          ),
          Expanded(
            child: Text(
              '$detail',
              style: detailStyle ?? StylesText.body3,
            ),
          )
        ],
      ),
    );
  }
}