ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-07-10 15:17:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

working on schedual table

Browse Source
This commit is contained in:
ashrafzarkanisala
2024-09-22 00:16:44 +03:00
parent 921ccf0132
commit 66f45721e5
3 changed files with 165 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/pages/common/buttons/default_button.dart
View File

@ -17,6 +17,7 @@ class DefaultButton extends StatelessWidget {
this.borderRadius,
this.height,
this.padding,
this.borderColor,
});
final void Function()? onPressed;
final Widget child;
@ -31,6 +32,8 @@ class DefaultButton extends StatelessWidget {
final ButtonStyle? customButtonStyle;
final Color? backgroundColor;
final Color? foregroundColor;
final Color? borderColor;
@override
Widget build(BuildContext context) {
return ElevatedButton(
@ -61,6 +64,7 @@ class DefaultButton extends StatelessWidget {
}),
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
side: BorderSide(color: borderColor ?? Colors.transparent),
borderRadius: BorderRadius.circular(borderRadius ?? 20),
),
),

222
lib/pages/device_managment/water_heater/widgets/schedual_view.dart
View File

@ -163,9 +163,27 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ElevatedButton(
onPressed: () => _showAddScheduleDialog(context),
child: Text('+ Add new schedule'),
SizedBox(
width: 170,
height: 40,
child: DefaultButton(
borderColor: ColorsManager.boxColor,
padding: 2,
backgroundColor: ColorsManager.graysColor,
borderRadius: 15,
onPressed: () => _showAddScheduleDialog(context),
child: Row(
children: [
const Icon(Icons.add, color: ColorsManager.primaryColor),
Text(
' Add new schedule',
style: context.textTheme.bodySmall!.copyWith(
color: ColorsManager.blackColor,
),
),
],
),
),
),
const SizedBox(height: 20),
_buildScheduleTable(state),
@ -219,8 +237,8 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
children: [
Center(
child: schedule.functionOn
? Icon(Icons.radio_button_checked)
: Icon(Icons.radio_button_unchecked)),
? const Icon(Icons.radio_button_checked)
: const Icon(Icons.radio_button_unchecked)),
Center(child: Text(_getSelectedDays(schedule.selectedDays))),
Center(child: Text(schedule.time.format(context))),
Center(child: Text(schedule.functionOn ? 'On' : 'Off')),
@ -230,7 +248,8 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
children: [
TextButton(
onPressed: () {
_showEditScheduleDialog(context, schedule, index);
_showAddScheduleDialog(context);
// _showEditScheduleDialog(context, schedule, index);
},
child: Text(
'Edit',
@ -298,7 +317,6 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
},
child: Text(selectedTime.format(context)),
),
// Same checkboxes and function on/off logic as before
],
),
actions: [
@ -340,7 +358,8 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
);
}
void _showAddScheduleDialog(BuildContext context) {
void _showAddScheduleDialog(
BuildContext context) {
showDialog(
context: context,
builder: (ctx) {
@ -352,10 +371,10 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
false,
false,
false
]; // Mon - Sun
];
TimeOfDay? selectedTime;
bool isOn = false;
return BlocProvider.value(
value: BlocProvider.of<WaterHeaterBloc>(context),
child: StatefulBuilder(
@ -363,44 +382,88 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
return AlertDialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20)),
title: const Text('Scheduling'),
content: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ElevatedButton(
onPressed: () async {
TimeOfDay? time = await showTimePicker(
context: context,
initialTime: TimeOfDay.now(),
);
if (time != null) {
setState(() {
selectedTime = time;
});
}
},
child: Text(
selectedTime == null
? 'Time'
: '${selectedTime!.format(context)}',
),
),
const SizedBox(height: 10),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_buildDayCheckbox(setState, 'Mon', 0, selectedDays),
_buildDayCheckbox(setState, 'Tue', 1, selectedDays),
_buildDayCheckbox(setState, 'Wed', 2, selectedDays),
_buildDayCheckbox(setState, 'Thu', 3, selectedDays),
_buildDayCheckbox(setState, 'Fri', 4, selectedDays),
_buildDayCheckbox(setState, 'Sat', 5, selectedDays),
_buildDayCheckbox(setState, 'Sun', 6, selectedDays),
const SizedBox(),
Text(
'Scheduling',
style: context.textTheme.titleLarge!.copyWith(
color: ColorsManager.dialogBlueTitle,
fontWeight: FontWeight.bold,
),
),
const SizedBox(),
],
),
const SizedBox(height: 10),
const SizedBox(
height: 24,
),
SizedBox(
width: 150,
height: 40,
child: DefaultButton(
padding: 8,
backgroundColor: ColorsManager.boxColor,
borderRadius: 15,
onPressed: () async {
TimeOfDay? time = await showTimePicker(
context: context,
initialTime: TimeOfDay.now(),
);
if (time != null) {
setState(() {
selectedTime = time;
});
}
},
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
selectedTime == null
? 'Time'
: selectedTime!.format(context),
style: context.textTheme.bodySmall!.copyWith(
color: ColorsManager.grayColor,
),
),
const Icon(
Icons.access_time,
color: ColorsManager.grayColor,
size: 18,
),
],
),
),
),
const SizedBox(height: 16),
Row(
children: [
const Text('Function:'),
_buildDayCheckbox(setState, 'Mon.', 0, selectedDays),
_buildDayCheckbox(setState, 'Tue.', 1, selectedDays),
_buildDayCheckbox(setState, 'Wed.', 2, selectedDays),
_buildDayCheckbox(setState, 'Thu.', 3, selectedDays),
_buildDayCheckbox(setState, 'Fri.', 4, selectedDays),
_buildDayCheckbox(setState, 'Sat.', 5, selectedDays),
_buildDayCheckbox(setState, 'Sun.', 6, selectedDays),
],
),
const SizedBox(height: 16),
Row(
children: [
Text(
'Function:',
style: context.textTheme.bodySmall!
.copyWith(color: ColorsManager.grayColor),
),
const SizedBox(
width: 10,
),
Radio<bool>(
value: true,
groupValue: isOn,
@ -411,6 +474,9 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
},
),
const Text('On'),
const SizedBox(
width: 10,
),
Radio<bool>(
value: false,
groupValue: isOn,
@ -426,25 +492,37 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
],
),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context);
},
child: const Text('Cancel'),
SizedBox(
width: 200,
child: DefaultButton(
height: 40,
onPressed: () {
Navigator.pop(context);
},
backgroundColor: ColorsManager.boxColor,
child: Text(
'Cancel',
style: context.textTheme.bodyMedium,
),
),
),
TextButton(
onPressed: () {
// Dispatch Bloc Event to Add Schedule
if (selectedTime != null) {
context.read<WaterHeaterBloc>().add(AddScheduleEvent(
time: selectedTime!,
selectedDays: selectedDays,
functionOn: isOn,
));
Navigator.pop(context); // Close the dialog
}
},
child: const Text('Save'),
SizedBox(
width: 200,
child: DefaultButton(
height: 40,
onPressed: () {
if (selectedTime != null) {
context.read<WaterHeaterBloc>().add(AddScheduleEvent(
time: selectedTime!,
selectedDays: selectedDays,
functionOn: isOn,
));
Navigator.pop(context);
}
},
backgroundColor: ColorsManager.primaryColor,
child: const Text('Save'),
),
),
],
);
@ -556,21 +634,31 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
List<Widget> _buildCountDownAngInchingView(
BuildContext context, WaterHeaterDeviceStatusLoaded state) {
final isCountDown =
state.scheduleMode?.name == ScheduleModes.countdown.name;
return [
Text(
'Countdown:',
isCountDown ? 'Countdown:' : 'Inching:',
style: context.textTheme.bodySmall!.copyWith(
fontSize: 13,
color: ColorsManager.grayColor,
),
),
const SizedBox(height: 4),
const SizedBox(height: 8),
Visibility(
visible: !isCountDown,
child: const Text(
'Once enabled this feature, each time the device is turned on, it will automatically turn of after a period time as pre-set.'),
),
const SizedBox(height: 8),
_hourMinutesWheel(state, context)
];
}
Row _hourMinutesWheel(
WaterHeaterDeviceStatusLoaded state, BuildContext context) {
final isActive =
(state.countdownRemaining != null && state.isActive == true);
return Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
@ -580,7 +668,7 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
hours: value,
minutes: state.minutes ?? 0,
));
}),
}, isActive: isActive),
const SizedBox(width: 10),
_buildPickerColumn(context, 'm', state.minutes ?? 0, 60, (value) {
context.read<WaterHeaterBloc>().add(UpdateScheduleEvent(
@ -588,18 +676,19 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
hours: state.hours ?? 0,
minutes: value,
));
}),
}, isActive: isActive),
],
);
}
Widget _buildPickerColumn(BuildContext context, String label,
int initialValue, int itemCount, ValueChanged<int> onSelected) {
int initialValue, int itemCount, ValueChanged<int> onSelected,
{required bool isActive}) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
height: 50,
height: 40,
width: 80,
padding: const EdgeInsets.symmetric(horizontal: 16),
decoration: BoxDecoration(
@ -619,7 +708,10 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
return Center(
child: Text(
index.toString().padLeft(2, '0'),
style: const TextStyle(fontSize: 24),
style: TextStyle(
fontSize: 24,
color: isActive ? ColorsManager.grayColor : Colors.black,
),
),
);
},
@ -627,7 +719,7 @@ class _BuildScheduleViewState extends State<BuildScheduleView> {
),
),
),
const SizedBox(height: 8),
const SizedBox(width: 8),
Text(
label,
style: const TextStyle(

7
lib/utils/theme/theme.dart
View File

@ -5,9 +5,10 @@ final myTheme = ThemeData(
fontFamily: 'Aftika',
textTheme: const TextTheme(
bodySmall: TextStyle(
fontSize: 13,
color: ColorsManager.whiteColors,
fontWeight: FontWeight.bold),
fontSize: 13,
color: ColorsManager.whiteColors,
fontWeight: FontWeight.normal,
),
bodyMedium: TextStyle(color: Colors.black87, fontSize: 14),
bodyLarge: TextStyle(fontSize: 16, color: Colors.white),
headlineSmall: TextStyle(color: Colors.black87, fontSize: 18),