You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

542 lines
20 KiB
Dart

import 'package:doctor_app_flutter/core/viewModel/project_view_model.dart';
import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:provider/provider.dart';
class StepsWidget extends StatelessWidget {
final int index;
final Function changeCurrentTab;
final double height;
StepsWidget({Key key, this.index, this.changeCurrentTab, this.height = 0.0});
// TODO : Add translation to name
@override
Widget build(BuildContext context) {
ProjectViewModel projectViewModel = Provider.of(context);
return !projectViewModel.isArabic
? Stack(
children: [
Container(
height: height == 0 ? 150 : height,
width: MediaQuery.of(context).size.width * 0.9,
color: Colors.transparent,
// child:,
),
Positioned(
top: 30
,
child: Center(
child: Container(
width: MediaQuery.of(context).size.width * 0.9,
child: Divider(
color: Colors.grey,
height: 0.75,
thickness: 0.75,
),
),
)),
Positioned(
top: 10,
left: 0,
child: InkWell(
onTap: () => changeCurrentTab(0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 0
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 0
? null
: Border.all(
color: Colors.black, width: 0.75),
shape: BoxShape.circle,
color: index == 0
? Color(0xFFCC9B14)
: index > 0
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(height: 5),
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
AppText(
"Subjective",
fontWeight: FontWeight.bold,
fontSize: 12,
),
StatusLabel(
selectedStepId: index,
stepId: 0,
),
],
),
],
),
),
),
Positioned(
top: 10,
left: MediaQuery
.of(context)
.size
.width * 0.25,
child: InkWell(
onTap: () => index >= 1 ? changeCurrentTab(1) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 1
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 2
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 1
? Color(0xFFCC9B14)
: index > 1
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(
height: 5,
),
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
AppText(
"Objective",
fontWeight: FontWeight.bold,
fontSize: 12,
),
StatusLabel(
selectedStepId: index,
stepId: 1,
),
],
),
],
),
),
),
Positioned(
top: 10,
left: MediaQuery
.of(context)
.size
.width * 0.50,
child: InkWell(
onTap: () {
if (index >= 3) changeCurrentTab(2);
},
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 2
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 2
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 2
? Color(0xFFCC9B14)
: index > 2
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(
height: 5,
),
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
AppText(
"Assessment",
fontWeight: FontWeight.bold,
fontSize: 12,
),
StatusLabel(
selectedStepId: index,
stepId: 2,
),
],
),
],
),
),
),
Positioned(
top: 10,
right: 0,
child: InkWell(
onTap: () => index >= 3 ? changeCurrentTab(4) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 3
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 3
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 3
? Color(0xFFCC9B14)
: index > 3
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(
height: 5,
),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
AppText(
"Plan",
fontWeight: FontWeight.bold,
// textAlign: TextAlign.center,
fontSize: 12,
),
StatusLabel(
selectedStepId: index,
stepId: 3,
),
],
),
],
),
),
),
],
)
: Stack(
children: [
Container(
height: height == 0 ? 150 : height,
width: MediaQuery.of(context).size.width,
color: Colors.transparent,
child: Center(
child: Divider(
color: Colors.grey,
height: 0.75,
thickness: 0.75,
),
),
),
Positioned(
top: 10,
right: 0,
child: InkWell(
onTap: () => changeCurrentTab(0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 0
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 0
? null
: Border.all(
color: Colors.black, width: 0.75),
shape: BoxShape.circle,
color: index == 0
? Color(0xFFCC9B14)
: index > 0
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(height: 5),
Column(
children: [
AppText(
"شخصي",
fontWeight: FontWeight.bold,
fontSize: 16,
),
StatusLabel(
selectedStepId: index,
stepId: 0,
),
],
),
],
),
),
),
Positioned(
top: 10,
right: MediaQuery
.of(context)
.size
.width * 0.28,
child: InkWell(
onTap: () => index >= 2 ? changeCurrentTab(1) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 1
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 2
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 1
? Color(0xFFCC9B14)
: index > 1
? Color(0xFF359846)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(height: 5),
Column(
children: [
AppText(
"هدف",
fontWeight: FontWeight.bold,
fontSize: 14,
),
StatusLabel(
selectedStepId: index,
stepId: 1,
),
],
),
],
),
),
),
Positioned(
top: 10,
right: MediaQuery
.of(context)
.size
.width * 0.52,
child: InkWell(
onTap: () => index >= 3 ? changeCurrentTab(2) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 2
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 2
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 2
? Color(0xFFCC9B14)
: index > 2
? Color(0xFFCC9B14)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(
height: 5,
),
Padding(
padding: const EdgeInsets.only(right: 2),
child: Column(
children: [
AppText(
"تقدير",
fontWeight: FontWeight.bold,
fontSize: 14,
),
StatusLabel(
selectedStepId: index,
stepId: 2,
),
],
),
),
],
),
),
),
Positioned(
top: 10,
left: 0,
child: InkWell(
onTap: () => index >= 3 ? changeCurrentTab(4) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Container(
width: 38,
height: 38,
decoration: BoxDecoration(
border: index == 3
? Border.all(color: Color(0xFFCC9B14), width: 2)
: index > 3
? null
: Border.all(
color: Color(0xFFCCCCCC), width: 0.75),
shape: BoxShape.circle,
color: index == 3
? Color(0xFFCC9B14)
: index > 3
? Color(0xFFCC9B14)
: Color(0xFFCCCCCC),
),
child: Center(
child: Icon(
FontAwesomeIcons.check,
size: 20,
color: Colors.white,
)),
),
SizedBox(
height: 5,
),
Container(
margin: EdgeInsets.only(right: index == 3 ? 15 : 0),
child: Column(
children: [
AppText(
"خطة",
fontWeight: FontWeight.bold,
fontSize: 14,
),
StatusLabel(
selectedStepId: index,
stepId: 3,
),
],
),
),
],
),
),
),
],
);
}
}
class StatusLabel extends StatelessWidget {
const StatusLabel({
Key key,
this.stepId,
this.selectedStepId,
}) : super(key: key);
final int stepId;
final int selectedStepId;
@override
Widget build(BuildContext context) {
return Container(
width: 65,
padding: EdgeInsets.symmetric(horizontal: 2, vertical: 3),
decoration: BoxDecoration(
color: stepId == selectedStepId
? Color(0xFFF1E9D3)
: stepId < selectedStepId
? Color(0xFFD8E8DB)
: Color(0xFFCCCCCC),
borderRadius: BorderRadius.all(
Radius.circular(5.0),
),
border: Border.all(color: HexColor('#707070'), width: 0.30),
),
child: AppText(
stepId == selectedStepId
? "inProgress"
: stepId < selectedStepId
? "Completed"
: " Locked ",
fontWeight: FontWeight.bold,
textAlign: TextAlign.center,
fontSize: 10,
color: stepId == selectedStepId
? Color(0xFFCC9B14)
: stepId < selectedStepId
? Color(0xFF359846)
: Color(0xFF969696),
),
);
}
}