forked from eatvio/eatvio_app
80 lines
2.2 KiB
Dart
80 lines
2.2 KiB
Dart
import 'package:eatvio_app/features/insights/presentation/widgets/insights_colors.dart';
|
||
import 'package:flutter/material.dart';
|
||
|
||
/// Пилюли выбора периода (`1М 3М 6М 1Г Всё время`).
|
||
class PeriodPills<T> extends StatelessWidget {
|
||
const PeriodPills({
|
||
super.key,
|
||
required this.periods,
|
||
required this.selected,
|
||
required this.labelOf,
|
||
required this.keyOf,
|
||
this.onSelected,
|
||
});
|
||
|
||
final List<T> periods;
|
||
final T selected;
|
||
final String Function(T period) labelOf;
|
||
final String Function(T period) keyOf;
|
||
|
||
/// `null` — пилюли неинтерактивны (данные для периода ещё не подключены).
|
||
final ValueChanged<T>? onSelected;
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return SingleChildScrollView(
|
||
scrollDirection: Axis.horizontal,
|
||
child: Row(
|
||
children: [
|
||
for (final period in periods)
|
||
Padding(
|
||
padding: const EdgeInsets.only(right: 6),
|
||
child: _Pill(
|
||
key: Key('insights_period_${keyOf(period)}'),
|
||
label: labelOf(period),
|
||
isActive: period == selected,
|
||
onTap: onSelected == null ? null : () => onSelected!(period),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
);
|
||
}
|
||
}
|
||
|
||
class _Pill extends StatelessWidget {
|
||
const _Pill({
|
||
super.key,
|
||
required this.label,
|
||
required this.isActive,
|
||
required this.onTap,
|
||
});
|
||
|
||
final String label;
|
||
final bool isActive;
|
||
final VoidCallback? onTap;
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
return Material(
|
||
color: isActive ? InsightsColors.blue : InsightsColors.accentBackground,
|
||
borderRadius: BorderRadius.circular(999),
|
||
child: InkWell(
|
||
borderRadius: BorderRadius.circular(999),
|
||
onTap: onTap,
|
||
child: Padding(
|
||
padding: const EdgeInsets.symmetric(horizontal: 13, vertical: 7),
|
||
child: Text(
|
||
label,
|
||
style: TextStyle(
|
||
fontSize: 12.5,
|
||
fontWeight: FontWeight.w700,
|
||
color: isActive ? Colors.white : InsightsColors.subtitle,
|
||
),
|
||
),
|
||
),
|
||
),
|
||
);
|
||
}
|
||
}
|