intaleq_driver/lib/views/home/journal/schedule_page.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../../constant/finance_design_system.dart';
import '../../../controller/home/journal/schedule_controller.dart';

class SchedulePage extends StatelessWidget {
  SchedulePage({super.key});
  final ScheduleController controller = Get.put(ScheduleController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: FinanceDesignSystem.backgroundColor,
      appBar: AppBar(
        title: Text('My Schedule'.tr, style: const TextStyle(fontWeight: FontWeight.bold, color: FinanceDesignSystem.primaryDark)),
        backgroundColor: Colors.transparent, elevation: 0, centerTitle: true,
        leading: IconButton(icon: const Icon(Icons.arrow_back_ios_new_rounded, color: FinanceDesignSystem.primaryDark, size: 20), onPressed: () => Get.back()),
      ),
      body: GetBuilder<ScheduleController>(builder: (sc) {
        return SingleChildScrollView(
          padding: const EdgeInsets.all(16),
          child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            // Summary Card
            Container(
              padding: const EdgeInsets.all(20),
              decoration: BoxDecoration(
                gradient: FinanceDesignSystem.balanceGradient,
                borderRadius: BorderRadius.circular(FinanceDesignSystem.cardRadius),
              ),
              child: Row(children: [
                Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                  Text('Weekly Plan'.tr, style: TextStyle(color: Colors.white.withOpacity(0.7), fontSize: 14)),
                  const SizedBox(height: 8),
                  Text('${sc.totalWeeklyHours.toStringAsFixed(1)}h', style: const TextStyle(fontSize: 32, fontWeight: FontWeight.w900, color: Colors.white)),
                  Text('${sc.activeDays} ${'Days'.tr}', style: TextStyle(color: Colors.white.withOpacity(0.6), fontSize: 13)),
                ])),
                Container(
                  padding: const EdgeInsets.all(14),
                  decoration: BoxDecoration(color: Colors.white.withOpacity(0.15), borderRadius: BorderRadius.circular(14)),
                  child: const Icon(Icons.calendar_today_rounded, color: Colors.white, size: 28),
                ),
              ]),
            ),
            const SizedBox(height: 24),

            Text('Work Days'.tr, style: FinanceDesignSystem.headingStyle),
            const SizedBox(height: 12),

            ...sc.schedule.map((slot) => _buildDayCard(context, slot, sc)),
          ]),
        );
      }),
    );
  }

  Widget _buildDayCard(BuildContext context, WorkSlot slot, ScheduleController sc) {
    final isAr = Get.locale?.languageCode == 'ar';
    return Container(
      margin: const EdgeInsets.only(bottom: 10),
      padding: const EdgeInsets.all(14),
      decoration: BoxDecoration(
        color: slot.isActive ? Colors.white : Colors.grey.shade50,
        borderRadius: BorderRadius.circular(14),
        boxShadow: slot.isActive ? [BoxShadow(color: Colors.black.withOpacity(0.03), blurRadius: 8, offset: const Offset(0, 3))] : null,
      ),
      child: Row(children: [
        // Toggle
        GestureDetector(
          onTap: () => sc.toggleDay(slot.dayOfWeek),
          child: AnimatedContainer(
            duration: const Duration(milliseconds: 200),
            width: 44, height: 44,
            decoration: BoxDecoration(
              color: slot.isActive ? FinanceDesignSystem.accentBlue.withOpacity(0.1) : Colors.grey.shade200,
              borderRadius: BorderRadius.circular(12),
            ),
            child: Center(child: Text(
              isAr ? slot.dayNameAr.substring(0, 2) : slot.dayName,
              style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold,
                color: slot.isActive ? FinanceDesignSystem.accentBlue : Colors.grey.shade400),
            )),
          ),
        ),
        const SizedBox(width: 14),
        // Day name
        Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          Text(isAr ? slot.dayNameAr : slot.dayName.tr, style: TextStyle(
            fontSize: 14, fontWeight: FontWeight.w600,
            color: slot.isActive ? FinanceDesignSystem.primaryDark : Colors.grey.shade400)),
          if (slot.isActive)
            Text(slot.timeRange, style: TextStyle(fontSize: 12, color: Colors.grey.shade500)),
          if (!slot.isActive)
            Text('Day Off'.tr, style: TextStyle(fontSize: 12, color: Colors.grey.shade400, fontStyle: FontStyle.italic)),
        ])),
        // Time pickers
        if (slot.isActive) ...[
          _timePicker(context, slot.startTime, (t) => sc.updateStartTime(slot.dayOfWeek, t)),
          Padding(padding: const EdgeInsets.symmetric(horizontal: 4), child: Text('-', style: TextStyle(color: Colors.grey.shade400))),
          _timePicker(context, slot.endTime, (t) => sc.updateEndTime(slot.dayOfWeek, t)),
        ],
        // Toggle switch
        Switch(
          value: slot.isActive,
          onChanged: (_) => sc.toggleDay(slot.dayOfWeek),
          activeColor: FinanceDesignSystem.accentBlue,
        ),
      ]),
    );
  }

  Widget _timePicker(BuildContext context, TimeOfDay time, Function(TimeOfDay) onChanged) {
    return GestureDetector(
      onTap: () async {
        final picked = await showTimePicker(context: context, initialTime: time);
        if (picked != null) onChanged(picked);
      },
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
        decoration: BoxDecoration(color: Colors.grey.shade100, borderRadius: BorderRadius.circular(8)),
        child: Text('${time.hour.toString().padLeft(2, '0')}:${time.minute.toString().padLeft(2, '0')}',
          style: TextStyle(fontSize: 12, fontWeight: FontWeight.w600, color: FinanceDesignSystem.primaryDark)),
      ),
    );
  }
}