import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:gap/gap.dart';
import 'package:intl/intl.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/kw_box_decorations.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/core/presentation/widgets/icon_row_info_widget.dart';
import 'package:krow/features/events/domain/blocs/details/event_details_bloc.dart';
import 'package:krow/features/events/presentation/event_details/widgets/role/asigned_staff.dart';

class RoleWidget extends StatefulWidget {
  final PositionState roleState;

  const RoleWidget({super.key, required this.roleState});

  @override
  State<RoleWidget> createState() => _RoleWidgetState();
}

class _RoleWidgetState extends State<RoleWidget> {
  @override
  Widget build(BuildContext context) {
    var eventDate =
        widget.roleState.position.parentShift?.parentEvent?.startDate ??
            DateTime.now();
    return AnimatedContainer(
      duration: const Duration(milliseconds: 150),
      padding: const EdgeInsets.only(left: 12, right: 12),
      margin: const EdgeInsets.only(top: 8),
      decoration: KwBoxDecorations.primaryLight12,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildRoleHeader(context),
          AnimatedSize(
            duration: const Duration(milliseconds: 150),
            alignment: Alignment.topCenter,
            child: Container(
              height: widget.roleState.isExpanded ? null : 0,
              decoration: const BoxDecoration(),
              child: Column(
                children: [
                  IconRowInfoWidget(
                      icon: Assets.images.icons.data.svg(),
                      title: 'Department',
                      value: widget.roleState.position.department?.name ?? ''),
                  const Gap(16),
                  IconRowInfoWidget(
                      icon: Assets.images.icons.profile2user.svg(),
                      title: 'Number of Employee for one Role',
                      value: '${widget.roleState.position.count} persons'),
                  const Gap(16),
                  IconRowInfoWidget(
                      icon: Assets.images.icons.calendar.svg(),
                      title: 'Start Date & Time',
                      value: DateFormat('MM.dd.yyyy, hh:mm a').format(
                          eventDate.copyWith(
                              hour: widget.roleState.position.startTime.hour,
                              minute:
                                  widget.roleState.position.startTime.minute))),
                  const Gap(16),
                  IconRowInfoWidget(
                      icon: Assets.images.icons.calendar.svg(),
                      title: 'End Date & Time',
                      value: DateFormat('MM.dd.yyyy, hh:mm a').format(
                          eventDate.copyWith(
                              hour: widget.roleState.position.endTime.hour,
                              minute:
                                  widget.roleState.position.endTime.minute))),
                  const Gap(16),
                  Padding(
                    padding: const EdgeInsets.only(bottom: 16.0),
                    child: IconRowInfoWidget(
                        icon: Assets.images.icons.dollarSquare.svg(),
                        title: 'Value',
                        value: '\$${widget.roleState.position.price.toStringAsFixed(2)}'),
                  ),
                  if (widget.roleState.position.staffContacts.isNotEmpty) ...[
                    const Gap(16),
                    const Divider(
                        color: AppColors.grayTintStroke,
                        thickness: 1,
                        height: 0),
                    AssignedStaff(
                      roleState: widget.roleState,
                    ),
                  ]
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildRoleHeader(context) {
    return GestureDetector(
      onTap: () {
        BlocProvider.of<EventDetailsBloc>(context)
            .add(OnRoleHeaderTapEvent(widget.roleState));
      },
      child: Container(
        color: Colors.transparent,
        child: Padding(
          padding: const EdgeInsets.only(top: 24, bottom: 24),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(widget.roleState.position.businessSkill?.skill?.name ?? '',
                  style: AppTextStyles.headingH3),
              Container(
                height: 16,
                width: 16,
                color: Colors.transparent,
                child: AnimatedRotation(
                  duration: const Duration(milliseconds: 200),
                  turns: widget.roleState.isExpanded ? 0.5 : 0,
                  child: Center(
                    child: Assets.images.icons.chevronDown.svg(
                      colorFilter: ColorFilter.mode(
                        widget.roleState.isExpanded
                            ? AppColors.blackBlack
                            : AppColors.blackCaptionText,
                        BlendMode.srcIn,
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
