apksel-dev/apskel-pos-flutter-v2
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sync page

Browse Source
This commit is contained in:
efrilm
2025-10-24 23:20:41 +07:00
parent 6892895021
commit 79e109cfe4
10 changed files with 669 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/presentation/pages/sync/widgets/sync_completed.dart
+153
View File
@@ -0,0 +1,153 @@
import 'package:flutter/material.dart';
import '../../../../application/sync/sync_bloc.dart';
class SyncCompletedWidget extends StatelessWidget {
final SyncStats stats;
const SyncCompletedWidget({super.key, required this.stats});
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Success icon
Container(
width: 80,
height: 80,
decoration: BoxDecoration(
color: Colors.green.shade50,
borderRadius: BorderRadius.circular(40),
),
child: Icon(
Icons.check_circle,
size: 48,
color: Colors.green.shade600,
),
),
SizedBox(height: 20),
Text(
'Sinkronisasi Berhasil!',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.green.shade700,
),
),
SizedBox(height: 8),
Text(
'Data berhasil diunduh ke perangkat',
style: TextStyle(fontSize: 14, color: Colors.grey.shade600),
),
SizedBox(height: 20),
// Stats cards
Container(
padding: EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.grey.shade200),
),
child: Column(
children: [
Text(
'Data yang Diunduh',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: Colors.grey.shade700,
),
),
SizedBox(height: 12),
Column(
children: [
_buildStatItem(
'Kategori',
'${stats.totalCategories}',
Icons.category,
Colors.blue,
),
SizedBox(height: 8),
_buildStatItem(
'Produk',
'${stats.totalProducts}',
Icons.inventory_2,
Colors.green,
),
SizedBox(height: 8),
_buildStatItem(
'Variant',
'${stats.totalVariants}',
Icons.tune,
Colors.orange,
),
],
),
],
),
),
SizedBox(height: 12),
Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
color: Colors.grey.shade100,
borderRadius: BorderRadius.circular(6),
),
child: Text(
'Mengalihkan ke halaman utama...',
style: TextStyle(color: Colors.grey.shade600, fontSize: 10),
),
),
],
),
);
}
Widget _buildStatItem(
String label,
String value,
IconData icon,
Color color,
) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 12, vertical: 8),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(icon, size: 20, color: color),
SizedBox(width: 8),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
value,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: color,
),
),
Text(
label,
style: TextStyle(fontSize: 10, color: Colors.grey.shade600),
),
],
),
],
),
);
}
}
lib/presentation/pages/sync/widgets/sync_initial.dart
+28
View File
@@ -0,0 +1,28 @@
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
class SyncInitialWidget extends StatelessWidget {
const SyncInitialWidget({super.key});
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.download_rounded, size: 48, color: Colors.grey.shade400),
SizedBox(height: 12),
Text(
'Siap untuk sinkronisasi',
style: AppStyle.lg.copyWith(fontWeight: FontWeight.w500),
),
SizedBox(height: 4),
Text(
'Tekan tombol mulai untuk mengunduh data',
style: AppStyle.sm.copyWith(color: Colors.grey.shade600),
textAlign: TextAlign.center,
),
],
);
}
}
lib/presentation/pages/sync/widgets/sync_state.dart
+242
View File
@@ -0,0 +1,242 @@
import 'package:flutter/material.dart';
import '../../../../application/sync/sync_bloc.dart';
import '../../../../common/theme/theme.dart';
class SyncStateWidget extends StatelessWidget {
final SyncStep step;
final double progress;
final String message;
final Animation<double> progressAnimation;
const SyncStateWidget({
super.key,
required this.step,
required this.progress,
required this.message,
required this.progressAnimation,
});
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Progress circle
Stack(
alignment: Alignment.center,
children: [
SizedBox(
width: 100,
height: 100,
child: AnimatedBuilder(
animation: progressAnimation,
builder: (context, child) {
return CircularProgressIndicator(
value: progressAnimation.value,
strokeWidth: 6,
backgroundColor: Colors.grey.shade200,
valueColor: AlwaysStoppedAnimation<Color>(
AppColor.primary,
),
);
},
),
),
Column(
children: [
Icon(_getSyncIcon(step), size: 24, color: AppColor.primary),
SizedBox(height: 2),
AnimatedBuilder(
animation: progressAnimation,
builder: (context, child) {
return Text(
'${(progressAnimation.value * 100).toInt()}%',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.bold,
color: AppColor.primary,
),
);
},
),
],
),
],
),
SizedBox(height: 20),
// Step indicator
_buildStepIndicator(step),
SizedBox(height: 12),
// Current message
Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration(
color: Colors.blue.shade50,
borderRadius: BorderRadius.circular(8),
),
child: Text(
message,
style: TextStyle(
color: Colors.blue.shade700,
fontSize: 12,
fontWeight: FontWeight.w500,
),
textAlign: TextAlign.center,
),
),
SizedBox(height: 12),
// Sync details
_buildSyncDetails(step, progress),
],
),
);
}
Widget _buildSyncDetails(SyncStep step, double progress) {
return Container(
padding: EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
border: Border.all(color: Colors.grey.shade200),
),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Status:',
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Colors.grey.shade700,
),
),
Text(
_getStepLabel(step),
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
],
),
SizedBox(height: 6),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Progress:',
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Colors.grey.shade700,
),
),
Text(
'${(progress * 100).toInt()}%',
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: AppColor.primary,
),
),
],
),
],
),
);
}
Widget _buildStepIndicator(SyncStep currentStep) {
final steps = [
('Kategori', SyncStep.categories, Icons.category),
('Produk', SyncStep.products, Icons.inventory_2),
('Variant', SyncStep.variants, Icons.tune),
('Selesai', SyncStep.completed, Icons.check_circle),
];
return Column(
children: steps.map((stepData) {
final (label, step, icon) = stepData;
final isActive = step == currentStep;
final isCompleted = step.index < currentStep.index;
return Container(
margin: EdgeInsets.symmetric(vertical: 2),
padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: isActive
? AppColor.primary.withOpacity(0.1)
: isCompleted
? Colors.green.shade50
: Colors.grey.shade100,
borderRadius: BorderRadius.circular(6),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
isCompleted ? Icons.check : icon,
size: 12,
color: isActive
? AppColor.primary
: isCompleted
? Colors.green.shade600
: Colors.grey.shade500,
),
SizedBox(width: 4),
Text(
label,
style: TextStyle(
fontSize: 10,
fontWeight: isActive ? FontWeight.w600 : FontWeight.normal,
color: isActive
? AppColor.primary
: isCompleted
? Colors.green.shade600
: Colors.grey.shade600,
),
),
],
),
);
}).toList(),
);
}
IconData _getSyncIcon(SyncStep step) {
switch (step) {
case SyncStep.categories:
return Icons.category;
case SyncStep.products:
return Icons.inventory_2;
case SyncStep.variants:
return Icons.tune;
case SyncStep.completed:
return Icons.check_circle;
}
}
String _getStepLabel(SyncStep step) {
switch (step) {
case SyncStep.categories:
return 'Mengunduh Kategori';
case SyncStep.products:
return 'Mengunduh Produk';
case SyncStep.variants:
return 'Mengunduh Variant';
case SyncStep.completed:
return 'Selesai';
}
}
}