UI complete for patient registration Co-authored-by: Benoy Bose <benoybose@gmail.com> Reviewed-on: cosqnet/telemednet#2 Reviewed-by: Benoy Bose <benoybose@cosq.net> Co-authored-by: DhanshCOSQ <dhanshas@cosq.net> Co-committed-by: DhanshCOSQ <dhanshas@cosq.net>
208 lines
6.2 KiB
Dart
208 lines
6.2 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
class PatientDashboardScreen extends StatefulWidget {
|
|
const PatientDashboardScreen({super.key});
|
|
|
|
@override
|
|
State<PatientDashboardScreen> createState() => _PatientDashboardScreenState();
|
|
}
|
|
|
|
class _PatientDashboardScreenState extends State<PatientDashboardScreen> {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
body: SafeArea(
|
|
child: Column(
|
|
children: [
|
|
_buildSearchBar(),
|
|
Expanded(
|
|
child: ListView(
|
|
padding: const EdgeInsets.all(16),
|
|
children: [
|
|
_buildRealTimeCard(),
|
|
const SizedBox(height: 20),
|
|
_buildConsultationsSection(),
|
|
const SizedBox(height: 20),
|
|
_buildFindDoctorSection(),
|
|
],
|
|
),
|
|
),
|
|
_buildBottomNavBar(),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildSearchBar() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: const BoxDecoration(
|
|
color: Color.fromRGBO(96, 181, 250, 1),
|
|
borderRadius: BorderRadius.only(
|
|
bottomLeft: Radius.circular(50.0),
|
|
bottomRight: Radius.circular(50.0)),
|
|
),
|
|
child: TextField(
|
|
decoration: InputDecoration(
|
|
hintText: 'Search Doctor/Hospital/Symtoms',
|
|
prefixIcon: const Icon(Icons.search),
|
|
filled: true,
|
|
fillColor: Colors.white,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(30),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildRealTimeCard() {
|
|
return Container(
|
|
padding: const EdgeInsets.all(16),
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
colors: [Colors.lightBlue[100]!, Colors.lightBlue[50]!],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
borderRadius: BorderRadius.circular(16),
|
|
),
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text(
|
|
'Real-time care\nat your fingertips.',
|
|
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
|
|
),
|
|
const SizedBox(height: 16),
|
|
ElevatedButton(
|
|
onPressed: () {},
|
|
child: const Text('Consultation >'),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildConsultationsSection() {
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text('Consultations',
|
|
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
|
|
const SizedBox(height: 10),
|
|
SingleChildScrollView(
|
|
scrollDirection: Axis.horizontal,
|
|
child: Row(
|
|
children: [
|
|
_consultationCard('Dr Pom', '23/09/2024\n5:00AM-7:00AM'),
|
|
const SizedBox(width: 10),
|
|
_consultationCard('Dr I', '23/09/2024\n5:00AM-7:00AM'),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _consultationCard(String name, String schedule) {
|
|
return GestureDetector(
|
|
onTap: () {
|
|
// Handle the tap event
|
|
print('Tapped on consultation card for $name');
|
|
// You can add more functionality here, like navigating to a detail page
|
|
},
|
|
child: Card(
|
|
shadowColor: Colors.grey,
|
|
child: Container(
|
|
width: 200,
|
|
padding: const EdgeInsets.all(10),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
borderRadius: BorderRadius.circular(10),
|
|
boxShadow: [
|
|
BoxShadow(color: Colors.grey.withOpacity(0.5), blurRadius: 5),
|
|
],
|
|
),
|
|
child: Row(
|
|
children: [
|
|
CircleAvatar(
|
|
radius: 30,
|
|
backgroundColor: Colors.blue[100],
|
|
child: const Icon(Icons.person, size: 40, color: Colors.white),
|
|
),
|
|
const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(name,
|
|
style: const TextStyle(fontWeight: FontWeight.bold)),
|
|
Text(schedule, style: const TextStyle(fontSize: 12)),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildFindDoctorSection() {
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
const Text('Find a Doctor for your\nHealth Problem',
|
|
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
|
|
const SizedBox(height: 10),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
_categoryIcon(Icons.accessibility_new, Colors.blue),
|
|
_categoryIcon(Icons.remove_red_eye, Colors.blue),
|
|
_categoryIcon(Icons.medical_services, Colors.blue),
|
|
_categoryIcon(Icons.health_and_safety, Colors.blue),
|
|
_categoryIcon(Icons.child_care, Colors.blue),
|
|
],
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _categoryIcon(IconData icon, Color color) {
|
|
return Container(
|
|
padding: const EdgeInsets.all(10),
|
|
decoration: BoxDecoration(
|
|
color: color,
|
|
borderRadius: BorderRadius.circular(10),
|
|
),
|
|
child: Icon(icon, color: Colors.white, size: 30),
|
|
);
|
|
}
|
|
|
|
Widget _buildBottomNavBar() {
|
|
return BottomNavigationBar(
|
|
type: BottomNavigationBarType.fixed,
|
|
items: const [
|
|
BottomNavigationBarItem(icon: Icon(Icons.home), label: 'Home'),
|
|
BottomNavigationBarItem(icon: Icon(Icons.chat_bubble), label: 'Chat'),
|
|
BottomNavigationBarItem(icon: Icon(Icons.assignment), label: 'Records'),
|
|
BottomNavigationBarItem(icon: Icon(Icons.person), label: 'Profile'),
|
|
],
|
|
currentIndex: 0,
|
|
selectedItemColor: Colors.blue,
|
|
unselectedItemColor: Colors.grey,
|
|
onTap: (index) {
|
|
// Handle navigation
|
|
},
|
|
);
|
|
}
|
|
}
|