221 lines
9.3 KiB
Dart
221 lines
9.3 KiB
Dart
import 'package:epic_story_app/core/constants/size/epic_size.dart';
|
|
import 'package:epic_story_app/core/styles/epic_app_size.dart';
|
|
import 'package:epic_story_app/domain/entities/children_entity.dart';
|
|
import 'package:epic_story_app/feature/profiles/presentation/profile_controller.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:get/get.dart';
|
|
|
|
class ProfilePage extends StatelessWidget {
|
|
const ProfilePage({super.key});
|
|
|
|
static const Color _pageBackground = Color(0xFFC6B2E6);
|
|
static const Color _profileBox = Color(0xFFB400FF);
|
|
static const Color _logoutButton = Color(0xFFFF0000);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final ProfileController controller = Get.find();
|
|
|
|
return Scaffold(
|
|
backgroundColor: _pageBackground,
|
|
body: SafeArea(
|
|
child: Obx(
|
|
() {
|
|
final ChildrenEntity? children = controller.childrenData.value;
|
|
if (children == null) {
|
|
return const Center(
|
|
child: CircularProgressIndicator(
|
|
color: Color(0xFF7E32AB),
|
|
),
|
|
);
|
|
}
|
|
|
|
final photoUrl = children.photoPicture;
|
|
final initials = _initials(children.fullName ?? '');
|
|
|
|
return Column(
|
|
children: [
|
|
SizedBox(
|
|
height: 146,
|
|
child: Stack(
|
|
clipBehavior: Clip.none,
|
|
children: [
|
|
Container(
|
|
height: EpicAppSize.calculatedSize(95),
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.fromLTRB(10, 8, 125, 8),
|
|
decoration: const BoxDecoration(
|
|
borderRadius: BorderRadius.vertical(
|
|
bottom: Radius.circular(18),
|
|
),
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.bottomCenter,
|
|
colors: [
|
|
Color(0xFF2C0B3A),
|
|
Color(0xFF7E32AB),
|
|
],
|
|
stops: [0.1, 1.0],
|
|
),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
SizedBox(width: EpicAppSize.calculatedSize(50)),
|
|
Image.asset(
|
|
'assets/images/coin-gancet.png',
|
|
width: EpicAppSize.calculatedSize(60),
|
|
height: EpicAppSize.calculatedSize(60),
|
|
fit: BoxFit.contain,
|
|
),
|
|
SizedBox(width: EpicAppSize.calculatedSize(8)),
|
|
Text(
|
|
'Profil Kamu',
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: EpicAppSize.calculatedSize(30),
|
|
fontWeight: FontWeight.w900,
|
|
height: 1,
|
|
shadows: [
|
|
Shadow(
|
|
color: Color(0x3D000000),
|
|
blurRadius: 2,
|
|
offset: Offset(0, 2),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Positioned(
|
|
top: -12,
|
|
right: 6,
|
|
child: Image.asset(
|
|
'assets/images/icon-top-bar.png',
|
|
width: EpicAppSize.calculatedSize(100),
|
|
height: EpicAppSize.calculatedSize(100),
|
|
fit: BoxFit.contain,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Expanded(
|
|
child: SingleChildScrollView(
|
|
physics: const BouncingScrollPhysics(),
|
|
padding: const EdgeInsets.fromLTRB(24, 6, 24, 24),
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
width: 240,
|
|
padding: const EdgeInsets.fromLTRB(18, 16, 18, 18),
|
|
decoration: BoxDecoration(
|
|
color: _profileBox,
|
|
borderRadius: BorderRadius.circular(16),
|
|
boxShadow: const [
|
|
BoxShadow(
|
|
color: Color(0x29000000),
|
|
blurRadius: 8,
|
|
offset: Offset(0, 3),
|
|
),
|
|
],
|
|
),
|
|
child: Column(
|
|
children: [
|
|
CircleAvatar(
|
|
radius: 56,
|
|
backgroundColor: const Color(0xFFC8A2E8),
|
|
backgroundImage:
|
|
photoUrl != null && photoUrl.isNotEmpty
|
|
? NetworkImage(photoUrl)
|
|
: null,
|
|
child: photoUrl == null || photoUrl.isEmpty
|
|
? Text(
|
|
initials,
|
|
style: const TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 34,
|
|
fontWeight: FontWeight.w900,
|
|
),
|
|
)
|
|
: null,
|
|
),
|
|
const SizedBox(height: 14),
|
|
Text(
|
|
children.fullName ?? 'Nama tidak tersedia',
|
|
textAlign: TextAlign.center,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: EpicSize.headlineLarge.copyWith(
|
|
color: Colors.white,
|
|
fontWeight: FontWeight.w900,
|
|
fontSize: EpicAppSize.calculatedSize(30),
|
|
height: 0.95,
|
|
),
|
|
),
|
|
const SizedBox(height: 6),
|
|
Text(
|
|
children.email ?? '-',
|
|
textAlign: TextAlign.center,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: EpicAppSize.calculatedSize(18),
|
|
fontWeight: FontWeight.w500,
|
|
height: 1,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(height: 68),
|
|
SizedBox(
|
|
width: 122,
|
|
height: 52,
|
|
child: ElevatedButton(
|
|
onPressed: controller.logout,
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: _logoutButton,
|
|
elevation: 4,
|
|
shape: RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.circular(15),
|
|
// side: const BorderSide(
|
|
// color: Colors.white,
|
|
// width: 1.1,
|
|
// ),
|
|
),
|
|
),
|
|
child: Text(
|
|
'Logout',
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: EpicAppSize.calculatedSize(22),
|
|
fontWeight: FontWeight.w900,
|
|
height: 1,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
String _initials(String name) {
|
|
final parts = name.trim().split(RegExp(r'\s+'));
|
|
if (parts.isEmpty) return '??';
|
|
final first = parts.first.isNotEmpty ? parts.first[0] : '';
|
|
final last = parts.length > 1 && parts.last.isNotEmpty ? parts.last[0] : '';
|
|
final result = (first + last).toUpperCase();
|
|
return result.isEmpty ? '??' : result;
|
|
}
|
|
}
|