import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:router/ext/auto_router_extensions.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/my_appbar.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/widget_export.dart';

import '../../router/page/facility_page_router.dart';
import 'facility_booking_view_model.dart';

@RoutePage()
class FacilityBookingPage extends HookConsumerWidget {
  const FacilityBookingPage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance({BuildContext? context}) {
    if (context != null) {
      context.router.push(const FacilityBookingPageRoute());
    } else {
      appRouter.push(const FacilityBookingPageRoute());
    }
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final viewModel = ref.watch(facilityBookingViewModelProvider.notifier);
    final state = ref.watch(facilityBookingViewModelProvider);

    return Scaffold(
      appBar: MyAppBar.appBar(context, "Kids party room", backgroundColor: context.appColors.whiteBG),
      backgroundColor: context.appColors.backgroundDark,
      body: SingleChildScrollView(
        scrollDirection: Axis.vertical,
        physics: const BouncingScrollPhysics(),
        child: Column(
          mainAxisSize: MainAxisSize.max,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            MyTextView(
              "Friday,11 October 2024",
              textColor: context.appColors.textBlack,
              fontSize: 17,
              marginTop: 18,
              marginBottom: 16,
              marginLeft: 15,
              isFontMedium: true,
            ),
            WeeklyCalendar(
              isAutoSelect: false,
              selectedDate: DateTime.now().add(Duration(days: 1)),
              onChangedSelectedDate: (dateTime) {
                Log.d("onChangedSelectedDate选中 - ${dateTime}}");
              },
              onChangedPage: (dateTime, state) {
                Log.d("onChangedPage - ${dateTime} state:${state}");
              },
            ),
          ],
        ),
      ),
    );
  }
}