sihooandClaude Sonnet 5
8a9b414535
친구 신청·수락, 그룹 생성·초대(친구 목록에서 선택)·오늘 출석 현황 공유, 개인 연속 출석(스트릭) 달력, 관리자가 날짜별로 선물/이벤트를 등록하는 달력 관리 화면을 추가. 대시보드에 학생용 3개(친구/그룹 스터디/출석 달력) + 교사·관리자용 1개(출석 달력 관리) 타일을 배치. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
405 lines
15 KiB
Dart
405 lines
15 KiB
Dart
// 📅 백품타 출석 달력 화면 (UI 전용) - 개인 연속출석(스트릭) + 관리자 이벤트 달력.
|
|
// "실시간 출석 현황"과 같은 패밀리룩(제목 알약 + 필 통계 + 둥근 카드)을 따른다.
|
|
// 서버 통신/상태는 lib/function/study_calendar_controller.dart가 담당한다.
|
|
import 'package:flutter/material.dart';
|
|
import '../function/study_calendar_controller.dart';
|
|
import '../theme/app_palette.dart';
|
|
import 'app_notice.dart';
|
|
import 'title_pill.dart';
|
|
|
|
class StudyCalendarScreen extends StatefulWidget {
|
|
final String studentId;
|
|
final bool canManageEvents;
|
|
|
|
const StudyCalendarScreen({
|
|
super.key,
|
|
required this.studentId,
|
|
this.canManageEvents = false,
|
|
});
|
|
|
|
@override
|
|
State<StudyCalendarScreen> createState() => _StudyCalendarScreenState();
|
|
}
|
|
|
|
class _StudyCalendarScreenState extends State<StudyCalendarScreen> {
|
|
late final StudyCalendarController _controller;
|
|
static const _weekdayLabels = ['일', '월', '화', '수', '목', '금', '토'];
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_controller = StudyCalendarController(studentId: widget.studentId);
|
|
_controller.init();
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_controller.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
String _dateKey(DateTime d) =>
|
|
'${d.year.toString().padLeft(4, '0')}-${d.month.toString().padLeft(2, '0')}-${d.day.toString().padLeft(2, '0')}';
|
|
|
|
Future<void> _onDayTap(DateTime day) async {
|
|
final key = _dateKey(day);
|
|
final event = _controller.events[key];
|
|
|
|
if (!widget.canManageEvents) {
|
|
if (event != null) {
|
|
await showDialog<void>(
|
|
context: context,
|
|
builder: (dialogContext) => AlertDialog(
|
|
title: Text(event['title'] ?? ''),
|
|
content: Text(
|
|
(event['description'] ?? '').toString().isEmpty
|
|
? '등록된 설명이 없어요.'
|
|
: event['description'],
|
|
),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.pop(dialogContext),
|
|
child: const Text('닫기'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
return;
|
|
}
|
|
|
|
final titleController = TextEditingController(text: event?['title'] ?? '');
|
|
final descController = TextEditingController(
|
|
text: event?['description'] ?? '',
|
|
);
|
|
|
|
await showModalBottomSheet<void>(
|
|
context: context,
|
|
isScrollControlled: true,
|
|
backgroundColor: AppPalette.paper,
|
|
shape: const RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
|
|
),
|
|
builder: (sheetContext) {
|
|
return Padding(
|
|
padding: EdgeInsets.only(
|
|
left: 20,
|
|
right: 20,
|
|
top: 20,
|
|
bottom: MediaQuery.of(sheetContext).viewInsets.bottom + 20,
|
|
),
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
crossAxisAlignment: CrossAxisAlignment.stretch,
|
|
children: [
|
|
Text(
|
|
'$key 이벤트',
|
|
style: const TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 16,
|
|
),
|
|
),
|
|
const SizedBox(height: 12),
|
|
TextField(
|
|
controller: titleController,
|
|
maxLength: 30,
|
|
decoration: InputDecoration(
|
|
hintText: '제목 (예: 기프티콘 이벤트)',
|
|
filled: true,
|
|
fillColor: AppPalette.mist,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
),
|
|
),
|
|
TextField(
|
|
controller: descController,
|
|
maxLength: 100,
|
|
maxLines: 3,
|
|
decoration: InputDecoration(
|
|
hintText: '설명 (선택)',
|
|
filled: true,
|
|
fillColor: AppPalette.mist,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(12),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 12),
|
|
Row(
|
|
children: [
|
|
if (event != null)
|
|
Expanded(
|
|
child: OutlinedButton(
|
|
onPressed: () async {
|
|
final (success, message) = await _controller
|
|
.deleteEvent(key);
|
|
if (sheetContext.mounted) {
|
|
Navigator.of(sheetContext).pop();
|
|
}
|
|
if (!mounted) return;
|
|
AppNotice.show(context, message);
|
|
},
|
|
child: const Text(
|
|
'삭제',
|
|
style: TextStyle(color: Colors.red),
|
|
),
|
|
),
|
|
),
|
|
if (event != null) const SizedBox(width: 8),
|
|
Expanded(
|
|
child: ElevatedButton(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: AppPalette.ink,
|
|
foregroundColor: AppPalette.paper,
|
|
),
|
|
onPressed: () async {
|
|
if (titleController.text.trim().isEmpty) return;
|
|
final (success, message) = await _controller.saveEvent(
|
|
date: key,
|
|
title: titleController.text,
|
|
description: descController.text,
|
|
createdBy: widget.studentId,
|
|
);
|
|
if (sheetContext.mounted) {
|
|
Navigator.of(sheetContext).pop();
|
|
}
|
|
if (!mounted) return;
|
|
AppNotice.show(
|
|
context,
|
|
message,
|
|
icon: success
|
|
? Icons.check_circle_rounded
|
|
: Icons.error_outline_rounded,
|
|
);
|
|
},
|
|
child: const Text('저장'),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return ListenableBuilder(
|
|
listenable: _controller,
|
|
builder: (context, _) {
|
|
final month = _controller.visibleMonth;
|
|
final firstOfMonth = DateTime(month.year, month.month, 1);
|
|
final daysInMonth = DateTime(month.year, month.month + 1, 0).day;
|
|
final leadingBlanks = firstOfMonth.weekday % 7;
|
|
final today = DateTime.now();
|
|
|
|
return Scaffold(
|
|
backgroundColor: AppPalette.mist,
|
|
appBar: AppBar(
|
|
backgroundColor: Colors.transparent,
|
|
foregroundColor: AppPalette.ink,
|
|
elevation: 0,
|
|
),
|
|
body: _controller.isLoading
|
|
? const Center(child: CircularProgressIndicator())
|
|
: ListView(
|
|
padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
|
|
children: [
|
|
const Center(child: TitlePill('출석 달력')),
|
|
const SizedBox(height: 16),
|
|
Row(
|
|
children: [
|
|
Expanded(
|
|
child: _statPill('연속 출석', _controller.currentStreak),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: _statPill('최장 기록', _controller.longestStreak),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 20),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
IconButton(
|
|
icon: const Icon(Icons.chevron_left_rounded),
|
|
onPressed: _controller.goToPreviousMonth,
|
|
),
|
|
Text(
|
|
'${month.year}년 ${month.month}월',
|
|
style: const TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 16,
|
|
),
|
|
),
|
|
IconButton(
|
|
icon: const Icon(Icons.chevron_right_rounded),
|
|
onPressed: _controller.goToNextMonth,
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 8),
|
|
Row(
|
|
children: [
|
|
for (final label in _weekdayLabels)
|
|
Expanded(
|
|
child: Center(
|
|
child: Text(
|
|
label,
|
|
style: TextStyle(
|
|
color: Colors.grey[500],
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 6),
|
|
GridView.builder(
|
|
shrinkWrap: true,
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
gridDelegate:
|
|
const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 7,
|
|
mainAxisSpacing: 6,
|
|
crossAxisSpacing: 6,
|
|
childAspectRatio: 0.85,
|
|
),
|
|
itemCount: leadingBlanks + daysInMonth,
|
|
itemBuilder: (context, index) {
|
|
if (index < leadingBlanks) {
|
|
return const SizedBox.shrink();
|
|
}
|
|
final day = index - leadingBlanks + 1;
|
|
final date = DateTime(month.year, month.month, day);
|
|
final key = _dateKey(date);
|
|
final studied = _controller.studiedDates.contains(key);
|
|
final event = _controller.events[key];
|
|
final isToday =
|
|
date.year == today.year &&
|
|
date.month == today.month &&
|
|
date.day == today.day;
|
|
|
|
return GestureDetector(
|
|
onTap: () => _onDayTap(date),
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color: studied
|
|
? AppPalette.ink
|
|
: AppPalette.paper,
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(
|
|
color: isToday
|
|
? AppPalette.ink
|
|
: AppPalette.sage,
|
|
width: isToday ? 2 : 1,
|
|
),
|
|
),
|
|
child: Stack(
|
|
children: [
|
|
Center(
|
|
child: Text(
|
|
'$day',
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
color: studied
|
|
? Colors.white
|
|
: AppPalette.ink,
|
|
),
|
|
),
|
|
),
|
|
if (event != null)
|
|
Positioned(
|
|
top: 3,
|
|
right: 3,
|
|
child: Icon(
|
|
Icons.card_giftcard_rounded,
|
|
size: 12,
|
|
color: studied
|
|
? Colors.white
|
|
: Colors.orange,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
const SizedBox(height: 16),
|
|
Row(
|
|
children: [
|
|
_legendDot(AppPalette.ink, '공부한 날'),
|
|
const SizedBox(width: 16),
|
|
_legendIcon(
|
|
Icons.card_giftcard_rounded,
|
|
Colors.orange,
|
|
'이벤트',
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
Widget _statPill(String label, int count) {
|
|
return Container(
|
|
padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 16),
|
|
decoration: BoxDecoration(
|
|
color: AppPalette.paper,
|
|
borderRadius: BorderRadius.circular(28),
|
|
border: Border.all(color: AppPalette.sage),
|
|
),
|
|
child: Column(
|
|
children: [
|
|
Text(label, style: TextStyle(fontSize: 12, color: Colors.grey[600])),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
'$count일',
|
|
style: const TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: AppPalette.ink,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _legendDot(Color color, String label) {
|
|
return Row(
|
|
children: [
|
|
Container(
|
|
width: 12,
|
|
height: 12,
|
|
decoration: BoxDecoration(color: color, shape: BoxShape.circle),
|
|
),
|
|
const SizedBox(width: 6),
|
|
Text(label, style: TextStyle(fontSize: 12, color: Colors.grey[600])),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _legendIcon(IconData icon, Color color, String label) {
|
|
return Row(
|
|
children: [
|
|
Icon(icon, size: 14, color: color),
|
|
const SizedBox(width: 6),
|
|
Text(label, style: TextStyle(fontSize: 12, color: Colors.grey[600])),
|
|
],
|
|
);
|
|
}
|
|
}
|