operational_hours_view.dart

Go to the documentation of this file.

import 'package:connect/core/ui/widgets/custom_card.dart';
import 'package:connect/features/co2_emmissions/screens/widgets/step_brogress_bar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:hugeicons/hugeicons.dart';
 
class OpertaionalHoursView extends StatefulWidget {
  const OpertaionalHoursView({super.key});
 
  @override
  State<OpertaionalHoursView> createState() => _OpertaionalHoursViewState();
}
 
class _OpertaionalHoursViewState extends State<OpertaionalHoursView> {
  List<String> options = [
    'Morning (6:00 AM - 12:00 PM)',
    'Afternoon (12:00 PM - 6:00 PM)',
    'Evening (6:00 PM - 12:00 AM)',
    'Late Night (12:00 AM - 6:00 AM)',
  ];
  List<String> selectedOption = [];
 
  void onSelect(String option) {
    if (selectedOption.contains(option)) {
      selectedOption.remove(option);
    } else {
      selectedOption.add(option);
    }
    setState(() {});
  }
 
  bool isSelected(String option) {
    return selectedOption.contains(option);
  }
 
  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: EdgeInsets.all(15.sp),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            width: double.infinity,
            padding: EdgeInsets.all(15.sp),
            decoration: BoxDecoration(
                color: Colors.blue.withOpacity(0.11),
                borderRadius: BorderRadius.circular(10)),
            child: Center(
              child: Text(
                'Operational Details',
                style: Theme.of(context)
                    .textTheme
                    .bodySmall
                    ?.copyWith(color: Colors.blue),
              ),
            ),
          ),
          SizedBox(height: 10.sp),
          CustomCard(
            padding: EdgeInsets.all(15.sp),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                SimpleProgressBar(
                  totalSteps: 2,
                  currentStep: 1,
                ),
                SizedBox(height: 10.sp),
                Text(
                  'What are your operating hours?',
                  style: Theme.of(context).textTheme.displaySmall?.copyWith(
                        fontSize: 12.sp,
                      ),
                ),
                SizedBox(height: 5.sp),
                Text(
                  '(Select all that apply):',
                  style: Theme.of(context).textTheme.displaySmall?.copyWith(
                        color: Theme.of(context).hintColor,
                        fontSize: 10.sp,
                      ),
                ),
                SizedBox(height: 20.sp),
                ListView.separated(
                  physics: NeverScrollableScrollPhysics(),
                  shrinkWrap: true,
                  itemCount: options.length,
                  separatorBuilder: (context, index) => SizedBox(height: 10.sp),
                  itemBuilder: (BuildContext context, int index) {
                    return CustomOptionButton(
                      option: options[index],
                      onPressed: () {
                        onSelect(options[index]);
                      },
                      isSelected: isSelected(options[index]),
                    );
                  },
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
 
class CustomOptionButton extends StatelessWidget {
  const CustomOptionButton({
    super.key,
    required this.option,
    required this.onPressed,
    required this.isSelected,
  });
 
  final String option;
  final Function() onPressed;
  final bool isSelected;
 
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      style: ElevatedButton.styleFrom(
        backgroundColor: isSelected
            ? Theme.of(context).colorScheme.primary.withOpacity(0.11)
            : Theme.of(context).colorScheme.surface,
        padding: EdgeInsets.all(15.sp),
      ),
      onPressed: onPressed,
      child: Row(
        children: [
          Container(
            height: isSelected ? 25.sp : 20.sp,
            width: isSelected ? 25.sp : 20.sp,
            decoration: BoxDecoration(
              color: isSelected
                  ? Theme.of(context).colorScheme.primary.withOpacity(0.11)
                  : Theme.of(context).colorScheme.surface,
              shape: BoxShape.circle,
              border: Border.all(
                width: 1,
                color: isSelected
                    ? Theme.of(context).colorScheme.primary
                    : Theme.of(context).hintColor,
              ),
            ),
            child: Icon(
              HugeIcons.strokeRoundedCheckmarkBadge04,
              size: 15.sp,
              color: isSelected
                  ? Theme.of(context).colorScheme.primary
                  : Theme.of(context).colorScheme.surface,
            ),
          ),
          SizedBox(width: 10.sp),
          Flexible(
            child: Text(
              option,
              style: Theme.of(context).textTheme.bodySmall?.copyWith(
                    color: isSelected
                        ? Theme.of(context).colorScheme.primary
                        : Theme.of(context)
                            .textTheme
                            .displaySmall
                            ?.color
                            ?.withOpacity(0.7),
                  ),
            ),
          ),
        ],
      ),
    );
  }
}