first step from patient search
parent
94f53e9a07
commit
d276a19e02
@ -1,11 +1,49 @@
|
|||||||
|
import 'package:doctor_app_flutter/widgets/home/home_item.dart';
|
||||||
import 'package:doctor_app_flutter/widgets/shared/app.drawer.dart';
|
import 'package:doctor_app_flutter/widgets/shared/app.drawer.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class Category {
|
||||||
|
final String id;
|
||||||
|
final String title;
|
||||||
|
final String image;
|
||||||
|
|
||||||
|
const Category({
|
||||||
|
@required this.id,
|
||||||
|
@required this.title,
|
||||||
|
this.image,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
class HomeScreen extends StatelessWidget {
|
class HomeScreen extends StatelessWidget {
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
|
const DUMMY_CATEGORIES = const [
|
||||||
|
Category(
|
||||||
|
id: 'c1',
|
||||||
|
title: 'My Schedule',
|
||||||
|
image: 'assets/images/user_id_icon.png',
|
||||||
|
),
|
||||||
|
Category(
|
||||||
|
id: 'c2',
|
||||||
|
title: 'Patient Search',
|
||||||
|
image: 'assets/images/user_id_icon.png',
|
||||||
|
),
|
||||||
|
];
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(title: Text('Home'),),
|
appBar: AppBar(
|
||||||
|
title: Text('Home'),
|
||||||
|
),
|
||||||
drawer: AppDrawer(),
|
drawer: AppDrawer(),
|
||||||
|
body: GridView(
|
||||||
|
padding: EdgeInsets.all(25),
|
||||||
|
children: DUMMY_CATEGORIES
|
||||||
|
.map((data) => HomeItem(data.id, data.title, data.image))
|
||||||
|
.toList(),
|
||||||
|
gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
|
||||||
|
maxCrossAxisExtent: 200,
|
||||||
|
childAspectRatio: 3 / 2,
|
||||||
|
crossAxisSpacing: 20,
|
||||||
|
mainAxisSpacing: 20)),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,9 +1,11 @@
|
|||||||
|
import 'package:doctor_app_flutter/widgets/shared/app.drawer.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
class MyScheduleScreen extends StatelessWidget {
|
class MyScheduleScreen extends StatelessWidget {
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(title: Text("My Schedule"),),
|
appBar: AppBar(title: Text("My Schedule"),),
|
||||||
|
drawer: AppDrawer(),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -0,0 +1,333 @@
|
|||||||
|
import 'package:doctor_app_flutter/routes.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:hexcolor/hexcolor.dart';
|
||||||
|
|
||||||
|
class PatientSearch extends StatefulWidget {
|
||||||
|
@override
|
||||||
|
_PatientSearchState createState() => _PatientSearchState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _PatientSearchState extends State<PatientSearch> {
|
||||||
|
final List<Map<String, String>> _items = [
|
||||||
|
{"text": "outPatiant1", "val": "1"},
|
||||||
|
{"text": "outPatiant3", "val": "3"},
|
||||||
|
{"text": "outPatiant2", "val": "2"},
|
||||||
|
];
|
||||||
|
String _selectedItem = '2';
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Scaffold(
|
||||||
|
appBar: AppBar(
|
||||||
|
title: Text("Search Patient"),
|
||||||
|
),
|
||||||
|
body: SingleChildScrollView(
|
||||||
|
child: LayoutBuilder(builder: (ctx, constraints) {
|
||||||
|
var smallScreenSize = 660;
|
||||||
|
bool isSmallScreen = constraints.maxWidth <= smallScreenSize;
|
||||||
|
return Container(
|
||||||
|
padding: EdgeInsets.all(15),
|
||||||
|
width: constraints.maxWidth * 0.9,
|
||||||
|
child: Form(
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: <Widget>[
|
||||||
|
Text(
|
||||||
|
'Patiant Type',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
Container(
|
||||||
|
width: double.infinity,
|
||||||
|
child: DropdownButton(
|
||||||
|
value: _selectedItem,
|
||||||
|
iconSize: 24,
|
||||||
|
elevation: 16,
|
||||||
|
selectedItemBuilder: (BuildContext context) {
|
||||||
|
return _items.map((item) {
|
||||||
|
return Text(item['text']);
|
||||||
|
}).toList();
|
||||||
|
},
|
||||||
|
onChanged: (String newValue) => {
|
||||||
|
setState(() {
|
||||||
|
_selectedItem = newValue;
|
||||||
|
})
|
||||||
|
},
|
||||||
|
items: _items.map((item) {
|
||||||
|
return DropdownMenuItem(
|
||||||
|
child: Text('${item['text']}'),
|
||||||
|
value: item['val'],
|
||||||
|
);
|
||||||
|
}).toList(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'First Name',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'First Name',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Middle Name',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Middle Name',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Last Name',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Last Name',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Phone Number',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Phone Number',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
// Container(child: GridView(gridDelegate: null,),)
|
||||||
|
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Patiant Type',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Enter ID',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Patiant Type',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Enter ID',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
'Patiant Type',
|
||||||
|
style: TextStyle(fontSize: 20),
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 15,
|
||||||
|
),
|
||||||
|
TextFormField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
hintText: 'Enter ID',
|
||||||
|
hintStyle: TextStyle(
|
||||||
|
fontSize: isSmallScreen
|
||||||
|
? 14
|
||||||
|
: constraints.maxWidth * 0.024),
|
||||||
|
enabledBorder: OutlineInputBorder(
|
||||||
|
borderRadius: BorderRadius.all(Radius.circular(20)),
|
||||||
|
borderSide: BorderSide(color: Hexcolor('#CCCCCC')),
|
||||||
|
),
|
||||||
|
focusedBorder: OutlineInputBorder(
|
||||||
|
borderRadius:
|
||||||
|
BorderRadius.all(Radius.circular(10.0)),
|
||||||
|
borderSide: BorderSide(
|
||||||
|
color: Theme.of(context).primaryColor),
|
||||||
|
)
|
||||||
|
//BorderRadius.all(Radius.circular(20));
|
||||||
|
),
|
||||||
|
validator: (value) {
|
||||||
|
if (value.isEmpty) {
|
||||||
|
return 'Please enter some text';
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
),
|
||||||
|
SizedBox(
|
||||||
|
height: 20,
|
||||||
|
)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}),
|
||||||
|
));
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,43 @@
|
|||||||
|
import 'package:doctor_app_flutter/routes.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class HomeItem extends StatelessWidget {
|
||||||
|
final String id;
|
||||||
|
final String title;
|
||||||
|
final String image;
|
||||||
|
HomeItem(this.id, this.title, this.image);
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return InkWell(
|
||||||
|
onTap: () => selectItem(context,id),
|
||||||
|
splashColor: Colors.red,
|
||||||
|
child: Container(
|
||||||
|
child: Column(
|
||||||
|
children: <Widget>[
|
||||||
|
Container(
|
||||||
|
child: CircleAvatar(
|
||||||
|
backgroundColor: Colors.white,
|
||||||
|
child: Image.asset(
|
||||||
|
|
||||||
|
image,
|
||||||
|
color: Theme.of(context).primaryColor,
|
||||||
|
),
|
||||||
|
)),
|
||||||
|
Text(title,style: TextStyle(fontSize: 20),)
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
void selectItem(BuildContext ctx, id ) {
|
||||||
|
String route;
|
||||||
|
if (id =='c2') {
|
||||||
|
route = PATIENT_SEARCH;
|
||||||
|
}
|
||||||
|
Navigator.of(ctx).pushNamed(route, arguments: {
|
||||||
|
'id': id,
|
||||||
|
'title': title,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue