sf-app-platform/lib/payments/view/screens/wage_screen.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:sf_app_platform/payments/view/screens/core/wallet_management_layout.dart';

import '../../domain/entities/kid.dart';
import '../../domain/ports/theme_port.dart';

class WageScreen extends StatefulWidget{
  final Kid kid;

  const WageScreen({super.key, required this.kid});
  
  @override
  State<WageScreen> createState() => WageScreenState();
  
}

class WageScreenState extends State<WageScreen>{
  String frequence = "weekly";
  var conditions = {"weeklyLimits": false, "incidences": false, "holidays": false};
  
  @override
  Widget build(BuildContext context) {
    ThemePort theme = context.read<ThemePort>();
    
    return WalletManagementLayout(
      kid: widget.kid,
      children: [
        Container(
          decoration: BoxDecoration(
            color: theme.getColorFor(ThemeCode.background_primary),
            borderRadius: BorderRadius.all(Radius.circular(20)),
          ),
          padding: EdgeInsets.all(10),
          child: Column(
            spacing: 10,
            children: [
              Text("Paga automática", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
              TextField(
                  decoration: InputDecoration(labelText: "Cantidad", hintText: "0€", border: OutlineInputBorder()),
                  keyboardType: TextInputType.number,
                  inputFormatters: [
                    FilteringTextInputFormatter.digitsOnly
                  ]
              ),
              Text("Saldo total disponible después: 30 €")
            ],
          ),
        ),
        Container(
          decoration: BoxDecoration(
            color: theme.getColorFor(ThemeCode.background_primary),
            borderRadius: BorderRadius.all(Radius.circular(20)),
          ),
          padding: EdgeInsets.all(10),
          child: Column(
            spacing: 10,
            children: [
              Text("Frecuencia", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
              Text("Cuándo se envía el dinero"),
              CheckboxListTile(
                title: Text('Semanal'),
                controlAffinity: ListTileControlAffinity.leading,
                value: frequence=="weekly",
                onChanged: (value) {
                  setState(() {
                    frequence="weekly";
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
              CheckboxListTile(
                title: Text('Cada dos semanas'),
                controlAffinity: ListTileControlAffinity.leading,
                value: frequence=="biweekly",
                onChanged: (value) {
                  setState(() {
                    frequence="biweekly";
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
              CheckboxListTile(
                title: Text('Mensual'),
                controlAffinity: ListTileControlAffinity.leading,
                value: frequence=="monthly",
                onChanged: (value) {
                  setState(() {
                    frequence="monthly";
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
              Container(width: double.infinity, child: DropdownMenu(
                label: Text("Día de la semana"),
                initialSelection: "Domingo",
                dropdownMenuEntries: List<DropdownMenuEntry>.generate(7, (int index){
                  final days = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
                  return DropdownMenuEntry(value: days[index], label: days[index]);
                })
              )),
              DropdownMenu(
                label: Text("Hora del día"),
                initialSelection: 9,
                dropdownMenuEntries: List<DropdownMenuEntry>.generate(24, (int index){
                  return DropdownMenuEntry(value: index, label: "$index:00");
                })
              ),
              TextField(
                minLines: 3,
                maxLines: 3,
                maxLength: 150,
                decoration: InputDecoration(
                  labelText: "Escribir mensaje a ${widget.kid.name} del motivo del ingreso",
                  hintText: "Escribe tu mensaje",
                  border: OutlineInputBorder(),
                )
              ),
              Align(
                alignment: Alignment.topLeft,
                child: Text("Máximo 150 caracteres"),
              )
            ],
          ),
        ),
        Container(
          decoration: BoxDecoration(
            color: theme.getColorFor(ThemeCode.background_primary),
            borderRadius: BorderRadius.all(Radius.circular(20)),
          ),
          padding: EdgeInsets.all(10),
          child: Column(
            spacing: 10,
            children: [
              Text("Condiciones", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
              Text("Este dato aparecerá en el reloj del peque"),
              CheckboxListTile(
                title: Text('Sólo si cumple límites semanales'),
                controlAffinity: ListTileControlAffinity.leading,
                value: conditions["weeklyLimits"],
                onChanged: (value) {
                  setState(() {
                    conditions["weeklyLimits"] = !conditions["weeklyLimits"]!;
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
              CheckboxListTile(
                title: Text('Sólo si no ha tenido incidencias'),
                controlAffinity: ListTileControlAffinity.leading,
                value: conditions["incidences"],
                onChanged: (value) {
                  setState(() {
                    conditions["incidences"] = !conditions["incidences"]!;
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
              CheckboxListTile(
                title: Text('Pausar durante vacaciones'),
                controlAffinity: ListTileControlAffinity.leading,
                value: conditions["holidays"],
                onChanged: (value) {
                  setState(() {
                    conditions["holidays"] = !conditions["holidays"]!;
                  });
                },
                activeColor: theme.getColorFor(ThemeCode.button_primary),
              ),
            ],
          ),
        ),
      ],
      footer: Container(
        padding: EdgeInsets.all(20),
        decoration: BoxDecoration(
          color: theme.getColorFor(ThemeCode.background_primary),
          borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20))
        ),
        child: Column(
          spacing: 10,
          children: [
            FilledButton(onPressed: ()=>{}, child: Container(
              width:double.infinity,
              padding: EdgeInsets.all(20),
              child: Center(child: Text("Activar paga automática"))
            )),
            TextButton(onPressed: ()=>{}, child: Text("Cancelar"))
          ],
        ),
      )
    );
  }
  
}