✨ Fortune graph
This commit is contained in:
@@ -2,43 +2,15 @@ import 'package:auto_route/auto_route.dart';
|
||||
import 'package:easy_localization/easy_localization.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:freezed_annotation/freezed_annotation.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:island/models/activity.dart';
|
||||
import 'package:island/pods/network.dart';
|
||||
import 'package:island/pods/event_calendar.dart';
|
||||
import 'package:island/screens/account/profile.dart';
|
||||
import 'package:island/widgets/app_scaffold.dart';
|
||||
import 'package:island/widgets/content/cloud_files.dart';
|
||||
import 'package:material_symbols_icons/symbols.dart';
|
||||
import 'package:riverpod_annotation/riverpod_annotation.dart';
|
||||
import 'package:island/widgets/account/event_calendar.dart';
|
||||
import 'package:island/widgets/account/fortune_graph.dart';
|
||||
import 'package:styled_widget/styled_widget.dart';
|
||||
import 'package:table_calendar/table_calendar.dart';
|
||||
|
||||
part 'event_calendar.g.dart';
|
||||
part 'event_calendar.freezed.dart';
|
||||
|
||||
@freezed
|
||||
sealed class EventCalendarQuery with _$EventCalendarQuery {
|
||||
const factory EventCalendarQuery({
|
||||
required String? uname,
|
||||
required int year,
|
||||
required int month,
|
||||
}) = _EventCalendarQuery;
|
||||
}
|
||||
|
||||
@riverpod
|
||||
Future<List<SnEventCalendarEntry>> accountEventCalendar(
|
||||
Ref ref,
|
||||
EventCalendarQuery query,
|
||||
) async {
|
||||
final client = ref.watch(apiClientProvider);
|
||||
final resp = await client.get('/accounts/${query.uname ?? 'me'}/calendar');
|
||||
return resp.data
|
||||
.map((e) => SnEventCalendarEntry.fromJson(e))
|
||||
.cast<SnEventCalendarEntry>()
|
||||
.toList();
|
||||
}
|
||||
|
||||
@RoutePage()
|
||||
class EventCalanderScreen extends HookConsumerWidget {
|
||||
@@ -47,170 +19,33 @@ class EventCalanderScreen extends HookConsumerWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final selectedMonth = useState(DateTime.now().month);
|
||||
final selectedYear = useState(DateTime.now().year);
|
||||
// Get the current date
|
||||
final now = DateTime.now();
|
||||
|
||||
final selectedDay = useState(DateTime.now());
|
||||
// Create the query for the current month
|
||||
final query = useState(
|
||||
EventCalendarQuery(uname: name, year: now.year, month: now.month),
|
||||
);
|
||||
|
||||
// Watch the event calendar data
|
||||
final events = ref.watch(eventCalendarProvider(query.value));
|
||||
final user = ref.watch(accountProvider(name));
|
||||
final events = ref.watch(
|
||||
accountEventCalendarProvider(
|
||||
EventCalendarQuery(
|
||||
uname: name,
|
||||
year: selectedYear.value,
|
||||
month: selectedMonth.value,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
final content = Column(
|
||||
children: [
|
||||
TableCalendar(
|
||||
locale: EasyLocalization.of(context)!.locale.toString(),
|
||||
firstDay: DateTime.now().add(Duration(days: -3650)),
|
||||
lastDay: DateTime.now().add(Duration(days: 3650)),
|
||||
focusedDay: DateTime.utc(
|
||||
selectedYear.value,
|
||||
selectedMonth.value,
|
||||
DateTime.now().day,
|
||||
),
|
||||
calendarFormat: CalendarFormat.month,
|
||||
selectedDayPredicate: (day) {
|
||||
return isSameDay(selectedDay.value, day);
|
||||
},
|
||||
onDaySelected: (value, _) {
|
||||
selectedDay.value = value;
|
||||
},
|
||||
onPageChanged: (focusedDay) {
|
||||
selectedMonth.value = focusedDay.month;
|
||||
selectedYear.value = focusedDay.year;
|
||||
},
|
||||
eventLoader: (day) {
|
||||
return events.value
|
||||
?.where((e) => isSameDay(e.date, day))
|
||||
.expand((e) => [...e.statuses, e.checkInResult])
|
||||
.where((e) => e != null)
|
||||
.toList() ??
|
||||
[];
|
||||
},
|
||||
calendarBuilders: CalendarBuilders(
|
||||
dowBuilder: (context, day) {
|
||||
final text = DateFormat.EEEEE().format(day);
|
||||
return Center(child: Text(text));
|
||||
},
|
||||
markerBuilder: (context, day, events) {
|
||||
var checkInResult =
|
||||
events.whereType<SnCheckInResult>().firstOrNull;
|
||||
if (checkInResult != null) {
|
||||
return Positioned(
|
||||
top: 32,
|
||||
child: Text(
|
||||
['大凶', '凶', '中平', '吉', '大吉'][checkInResult.level],
|
||||
style: TextStyle(
|
||||
fontSize: 9,
|
||||
color:
|
||||
isSameDay(selectedDay.value, day)
|
||||
? Theme.of(context).colorScheme.onPrimaryContainer
|
||||
: isSameDay(DateTime.now(), day)
|
||||
? Theme.of(
|
||||
context,
|
||||
).colorScheme.onSecondaryContainer
|
||||
: Theme.of(context).colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
),
|
||||
),
|
||||
const Divider(height: 1).padding(top: 8),
|
||||
AnimatedSwitcher(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
child: Builder(
|
||||
builder: (context) {
|
||||
final event =
|
||||
events.value
|
||||
?.where((e) => isSameDay(e.date, selectedDay.value))
|
||||
.firstOrNull;
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Text(DateFormat.EEEE().format(selectedDay.value))
|
||||
.fontSize(16)
|
||||
.bold()
|
||||
.textColor(
|
||||
Theme.of(context).colorScheme.onSecondaryContainer,
|
||||
),
|
||||
Text(DateFormat.yMd().format(selectedDay.value))
|
||||
.fontSize(12)
|
||||
.textColor(
|
||||
Theme.of(context).colorScheme.onSecondaryContainer,
|
||||
),
|
||||
const Gap(16),
|
||||
if (event?.checkInResult != null)
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Text(
|
||||
'checkInResultLevel${event!.checkInResult!.level}',
|
||||
).tr().fontSize(16).bold(),
|
||||
for (final tip in event.checkInResult!.tips)
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
spacing: 8,
|
||||
children: [
|
||||
Icon(
|
||||
Symbols.circle,
|
||||
size: 12,
|
||||
fill: 1,
|
||||
).padding(top: 4, right: 4),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(tip.title).bold(),
|
||||
Text(tip.content),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
).padding(top: 8),
|
||||
],
|
||||
),
|
||||
if (event?.checkInResult == null &&
|
||||
(event?.statuses.isEmpty ?? true))
|
||||
Text('eventCalanderEmpty').tr(),
|
||||
],
|
||||
).padding(vertical: 24, horizontal: 24);
|
||||
},
|
||||
),
|
||||
),
|
||||
if (name != 'me' && user.hasValue)
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
width: 1 / MediaQuery.of(context).devicePixelRatio,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
borderRadius: BorderRadius.all(Radius.circular(8)),
|
||||
),
|
||||
margin: EdgeInsets.all(16),
|
||||
child: Card(
|
||||
margin: EdgeInsets.zero,
|
||||
elevation: 0,
|
||||
color: Colors.transparent,
|
||||
child: ListTile(
|
||||
leading: ProfilePictureWidget(
|
||||
fileId: user.value!.profile.picture?.id,
|
||||
),
|
||||
title: Text(user.value!.nick).bold(),
|
||||
subtitle: Text('@${user.value!.name}'),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
// Track the selected day for synchronizing between widgets
|
||||
final selectedDay = useState(now);
|
||||
|
||||
void onMonthChanged(int year, int month) {
|
||||
query.value = EventCalendarQuery(
|
||||
uname: query.value.uname,
|
||||
year: year,
|
||||
month: month,
|
||||
);
|
||||
}
|
||||
|
||||
// Function to handle day selection for synchronizing between widgets
|
||||
void onDaySelected(DateTime day) {
|
||||
selectedDay.value = day;
|
||||
}
|
||||
|
||||
return AppScaffold(
|
||||
noBackground: false,
|
||||
@@ -223,9 +58,104 @@ class EventCalanderScreen extends HookConsumerWidget {
|
||||
MediaQuery.of(context).size.width > 480
|
||||
? ConstrainedBox(
|
||||
constraints: BoxConstraints(maxWidth: 480),
|
||||
child: Card(margin: EdgeInsets.all(16), child: content),
|
||||
child: Column(
|
||||
children: [
|
||||
Card(
|
||||
margin: EdgeInsets.all(16),
|
||||
child: Column(
|
||||
children: [
|
||||
// Use the reusable EventCalendarWidget
|
||||
EventCalendarWidget(
|
||||
events: events,
|
||||
initialDate: now,
|
||||
showEventDetails: true,
|
||||
onMonthChanged: onMonthChanged,
|
||||
onDaySelected: onDaySelected,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Add the fortune graph widget
|
||||
const Divider(height: 1),
|
||||
FortuneGraphWidget(
|
||||
events: events,
|
||||
constrainWidth: true,
|
||||
onPointSelected: onDaySelected,
|
||||
),
|
||||
|
||||
// Show user profile if viewing someone else's calendar
|
||||
if (name != 'me' && user.hasValue)
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
width:
|
||||
1 / MediaQuery.of(context).devicePixelRatio,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
borderRadius: BorderRadius.all(Radius.circular(8)),
|
||||
),
|
||||
margin: EdgeInsets.all(16),
|
||||
child: Card(
|
||||
margin: EdgeInsets.zero,
|
||||
elevation: 0,
|
||||
color: Colors.transparent,
|
||||
child: ListTile(
|
||||
leading: ProfilePictureWidget(
|
||||
fileId: user.value!.profile.picture?.id,
|
||||
),
|
||||
title: Text(user.value!.nick).bold(),
|
||||
subtitle: Text('@${user.value!.name}'),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
).center()
|
||||
: content,
|
||||
: Column(
|
||||
children: [
|
||||
// Use the reusable EventCalendarWidget
|
||||
EventCalendarWidget(
|
||||
events: events,
|
||||
initialDate: now,
|
||||
showEventDetails: true,
|
||||
onMonthChanged: onMonthChanged,
|
||||
onDaySelected: onDaySelected,
|
||||
),
|
||||
|
||||
// Add the fortune graph widget
|
||||
const Divider(height: 1),
|
||||
FortuneGraphWidget(
|
||||
events: events,
|
||||
onPointSelected: onDaySelected,
|
||||
).padding(horizontal: 8, vertical: 4),
|
||||
|
||||
// Show user profile if viewing someone else's calendar
|
||||
if (name != 'me' && user.hasValue)
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
width: 1 / MediaQuery.of(context).devicePixelRatio,
|
||||
color: Theme.of(context).dividerColor,
|
||||
),
|
||||
borderRadius: BorderRadius.all(Radius.circular(8)),
|
||||
),
|
||||
margin: EdgeInsets.all(16),
|
||||
child: Card(
|
||||
margin: EdgeInsets.zero,
|
||||
elevation: 0,
|
||||
color: Colors.transparent,
|
||||
child: ListTile(
|
||||
leading: ProfilePictureWidget(
|
||||
fileId: user.value!.profile.picture?.id,
|
||||
),
|
||||
title: Text(user.value!.nick).bold(),
|
||||
subtitle: Text('@${user.value!.name}'),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user