138 lines
5.0 KiB
Dart
138 lines
5.0 KiB
Dart
import 'package:flutter/material.dart';
|
||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||
import 'package:lucide_icons/lucide_icons.dart';
|
||
import '../services/draft_service.dart';
|
||
import '../screens/pending_analysis_screen.dart';
|
||
|
||
/// 未解析Draft（解析待ちアイテム）通知バナー
|
||
///
|
||
/// Phase 1: オフライン対応機能の一部
|
||
/// ホーム画面上部に表示され、未解析のDraftがある場合にのみ表示されます。
|
||
///
|
||
/// タップすると [PendingAnalysisScreen] へ遷移し、一括解析が可能です。
|
||
class PendingAnalysisBanner extends ConsumerWidget {
|
||
const PendingAnalysisBanner({super.key});
|
||
|
||
@override
|
||
Widget build(BuildContext context, WidgetRef ref) {
|
||
return FutureBuilder<int>(
|
||
future: DraftService.getPendingCount(),
|
||
builder: (context, snapshot) {
|
||
final pendingCount = snapshot.data ?? 0;
|
||
|
||
// 未解析アイテムがない場合は何も表示しない
|
||
if (pendingCount == 0) {
|
||
return const SizedBox.shrink();
|
||
}
|
||
|
||
return Container(
|
||
margin: const EdgeInsets.all(12),
|
||
decoration: BoxDecoration(
|
||
gradient: LinearGradient(
|
||
colors: [
|
||
Colors.orange.shade600,
|
||
Colors.orange.shade400,
|
||
],
|
||
),
|
||
borderRadius: BorderRadius.circular(12),
|
||
boxShadow: [
|
||
BoxShadow(
|
||
color: Colors.orange.withValues(alpha: 0.3),
|
||
blurRadius: 8,
|
||
offset: const Offset(0, 2),
|
||
),
|
||
],
|
||
),
|
||
child: Material(
|
||
color: Colors.transparent,
|
||
child: InkWell(
|
||
borderRadius: BorderRadius.circular(12),
|
||
onTap: () {
|
||
Navigator.of(context).push(
|
||
MaterialPageRoute(
|
||
builder: (context) => const PendingAnalysisScreen(),
|
||
),
|
||
);
|
||
},
|
||
child: Padding(
|
||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||
child: Row(
|
||
children: [
|
||
// アイコン
|
||
Container(
|
||
padding: const EdgeInsets.all(8),
|
||
decoration: BoxDecoration(
|
||
color: Colors.white.withValues(alpha: 0.2),
|
||
shape: BoxShape.circle,
|
||
),
|
||
child: const Icon(
|
||
LucideIcons.wifiOff,
|
||
color: Colors.white,
|
||
size: 24,
|
||
),
|
||
),
|
||
|
||
const SizedBox(width: 12),
|
||
|
||
// テキスト
|
||
Expanded(
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Row(
|
||
children: [
|
||
const Text(
|
||
'未解析の写真',
|
||
style: TextStyle(
|
||
color: Colors.white,
|
||
fontSize: 16,
|
||
fontWeight: FontWeight.bold,
|
||
),
|
||
),
|
||
const SizedBox(width: 8),
|
||
Container(
|
||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
|
||
decoration: BoxDecoration(
|
||
color: Colors.white,
|
||
borderRadius: BorderRadius.circular(12),
|
||
),
|
||
child: Text(
|
||
'$pendingCount件',
|
||
style: TextStyle(
|
||
color: Colors.orange.shade700,
|
||
fontSize: 14,
|
||
fontWeight: FontWeight.bold,
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
const SizedBox(height: 4),
|
||
const Text(
|
||
'オフライン時に撮影された写真があります',
|
||
style: TextStyle(
|
||
color: Colors.white,
|
||
fontSize: 13,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
|
||
// 矢印アイコン
|
||
const Icon(
|
||
LucideIcons.chevronRight,
|
||
color: Colors.white,
|
||
size: 24,
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
),
|
||
);
|
||
},
|
||
);
|
||
}
|
||
}
|