nouvelle transaction: fond dynamique vert/rouge + titre gras centré
This commit is contained in:
parent
bb3d4ebe2a
commit
d140548e5f
152
lib/app.dart
152
lib/app.dart
|
|
@ -60,80 +60,106 @@ class _YnabAppState extends ConsumerState<YnabApp> {
|
||||||
DateTime date = DateTime.now();
|
DateTime date = DateTime.now();
|
||||||
bool isExpense = true;
|
bool isExpense = true;
|
||||||
|
|
||||||
|
final colorScheme = Theme.of(context).colorScheme;
|
||||||
await showModalBottomSheet(
|
await showModalBottomSheet(
|
||||||
context: context,
|
context: context,
|
||||||
isScrollControlled: true,
|
isScrollControlled: true,
|
||||||
useSafeArea: true,
|
useSafeArea: true,
|
||||||
|
backgroundColor: Colors.transparent,
|
||||||
builder: (ctx) => StatefulBuilder(
|
builder: (ctx) => StatefulBuilder(
|
||||||
builder: (context, setSheetState) => Padding(
|
builder: (context, setSheetState) => Container(
|
||||||
padding: EdgeInsets.fromLTRB(24, 0, 24, MediaQuery.of(context).viewInsets.bottom + 24),
|
decoration: BoxDecoration(
|
||||||
child: Column(
|
color: isExpense ? colorScheme.errorContainer : colorScheme.primaryContainer,
|
||||||
mainAxisSize: MainAxisSize.min,
|
borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
|
||||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
),
|
||||||
children: [
|
child: Padding(
|
||||||
const SizedBox(height: 8),
|
padding: EdgeInsets.fromLTRB(24, 0, 24, MediaQuery.of(context).viewInsets.bottom + 24),
|
||||||
Text('Nouvelle transaction', style: Theme.of(context).textTheme.titleLarge),
|
child: Column(
|
||||||
const SizedBox(height: 20),
|
mainAxisSize: MainAxisSize.min,
|
||||||
TextField(
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||||
controller: payeeCtrl,
|
children: [
|
||||||
decoration: const InputDecoration(labelText: 'Bénéficiaire', hintText: 'Ex: Supermarché'),
|
const SizedBox(height: 12),
|
||||||
autofocus: true,
|
Center(
|
||||||
),
|
child: Container(
|
||||||
const SizedBox(height: 12),
|
width: 32,
|
||||||
TextField(
|
height: 4,
|
||||||
controller: amountCtrl,
|
decoration: BoxDecoration(
|
||||||
decoration: const InputDecoration(labelText: 'Montant', hintText: '0,00'),
|
color: colorScheme.onSurfaceVariant.withAlpha(80),
|
||||||
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
borderRadius: BorderRadius.circular(2),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 12),
|
),
|
||||||
SegmentedButton<bool>(
|
|
||||||
segments: const [
|
|
||||||
ButtonSegment(value: true, label: Text('Dépense'), icon: Icon(Icons.arrow_upward)),
|
|
||||||
ButtonSegment(value: false, label: Text('Revenu'), icon: Icon(Icons.arrow_downward)),
|
|
||||||
],
|
|
||||||
selected: {isExpense},
|
|
||||||
onSelectionChanged: (v) => setSheetState(() => isExpense = v.first),
|
|
||||||
style: ButtonStyle(
|
|
||||||
visualDensity: VisualDensity.compact,
|
|
||||||
),
|
),
|
||||||
),
|
const SizedBox(height: 16),
|
||||||
const SizedBox(height: 12),
|
Text(
|
||||||
DropdownMenu<int>(
|
'Nouvelle transaction',
|
||||||
initialSelection: accountId,
|
textAlign: TextAlign.center,
|
||||||
label: const Text('Compte'),
|
style: Theme.of(context).textTheme.titleLarge?.copyWith(
|
||||||
expandedInsets: EdgeInsets.zero,
|
fontWeight: FontWeight.bold,
|
||||||
dropdownMenuEntries: accounts
|
),
|
||||||
.map((a) => DropdownMenuEntry(value: a.id, label: a.name))
|
),
|
||||||
.toList(),
|
const SizedBox(height: 20),
|
||||||
onSelected: (v) {
|
TextField(
|
||||||
if (v != null) accountId = v;
|
controller: payeeCtrl,
|
||||||
},
|
decoration: const InputDecoration(labelText: 'Bénéficiaire', hintText: 'Ex: Supermarché'),
|
||||||
),
|
autofocus: true,
|
||||||
const SizedBox(height: 24),
|
),
|
||||||
FilledButton(
|
const SizedBox(height: 12),
|
||||||
onPressed: () async {
|
TextField(
|
||||||
final payee = payeeCtrl.text.trim();
|
controller: amountCtrl,
|
||||||
final amountStr = amountCtrl.text.trim().replaceAll(',', '.');
|
decoration: const InputDecoration(labelText: 'Montant', hintText: '0,00'),
|
||||||
final raw = double.tryParse(amountStr);
|
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||||
if (payee.isEmpty || raw == null || accountId == null) return;
|
),
|
||||||
final amount = isExpense ? -raw.abs() : raw.abs();
|
const SizedBox(height: 12),
|
||||||
await db.into(db.transactions).insert(TransactionsCompanion.insert(
|
SegmentedButton<bool>(
|
||||||
accountId: accountId!,
|
segments: const [
|
||||||
payee: payee,
|
ButtonSegment(value: true, label: Text('Dépense'), icon: Icon(Icons.arrow_upward)),
|
||||||
amount: amount,
|
ButtonSegment(value: false, label: Text('Revenu'), icon: Icon(Icons.arrow_downward)),
|
||||||
date: date,
|
],
|
||||||
));
|
selected: {isExpense},
|
||||||
if (context.mounted) Navigator.pop(context);
|
onSelectionChanged: (v) => setSheetState(() => isExpense = v.first),
|
||||||
},
|
style: ButtonStyle(
|
||||||
child: const Text('Ajouter'),
|
visualDensity: VisualDensity.compact,
|
||||||
),
|
),
|
||||||
],
|
),
|
||||||
|
const SizedBox(height: 12),
|
||||||
|
DropdownMenu<int>(
|
||||||
|
initialSelection: accountId,
|
||||||
|
label: const Text('Compte'),
|
||||||
|
expandedInsets: EdgeInsets.zero,
|
||||||
|
dropdownMenuEntries: accounts
|
||||||
|
.map((a) => DropdownMenuEntry(value: a.id, label: a.name))
|
||||||
|
.toList(),
|
||||||
|
onSelected: (v) {
|
||||||
|
if (v != null) accountId = v;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
const SizedBox(height: 24),
|
||||||
|
FilledButton(
|
||||||
|
onPressed: () async {
|
||||||
|
final payee = payeeCtrl.text.trim();
|
||||||
|
final amountStr = amountCtrl.text.trim().replaceAll(',', '.');
|
||||||
|
final raw = double.tryParse(amountStr);
|
||||||
|
if (payee.isEmpty || raw == null || accountId == null) return;
|
||||||
|
final amount = isExpense ? -raw.abs() : raw.abs();
|
||||||
|
await db.into(db.transactions).insert(TransactionsCompanion.insert(
|
||||||
|
accountId: accountId!,
|
||||||
|
payee: payee,
|
||||||
|
amount: amount,
|
||||||
|
date: date,
|
||||||
|
));
|
||||||
|
if (context.mounted) Navigator.pop(context);
|
||||||
|
},
|
||||||
|
child: const Text('Ajouter'),
|
||||||
|
),
|
||||||
|
const SizedBox(height: 8),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
|
||||||
|
|
||||||
|
}
|
||||||
void _toggleSearch() {
|
void _toggleSearch() {
|
||||||
setState(() {
|
setState(() {
|
||||||
_searchActive = !_searchActive;
|
_searchActive = !_searchActive;
|
||||||
|
|
|
||||||
|
|
@ -109,7 +109,6 @@ final ThemeData ynabTheme = ThemeData(
|
||||||
),
|
),
|
||||||
bottomSheetTheme: const BottomSheetThemeData(
|
bottomSheetTheme: const BottomSheetThemeData(
|
||||||
backgroundColor: kSurfaceCard,
|
backgroundColor: kSurfaceCard,
|
||||||
showDragHandle: true,
|
|
||||||
shape: RoundedRectangleBorder(
|
shape: RoundedRectangleBorder(
|
||||||
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
|
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
|
||||||
),
|
),
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue