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

UI Enhancement

Browse Source
This commit is contained in:
Rafeek-Khoudare
2025-06-29 15:50:37 +03:00
parent 6dd3329288
commit 354d61dfa2
12 changed files with 266 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/pages/device_managment/curtain_module/widgets/accurate_calibrating_dialog.dart
View File

@ -23,8 +23,8 @@ class AccurteCalibratingDialog extends StatelessWidget {
body: const NormalTextBodyForDialog( body: const NormalTextBodyForDialog(
title: '', title: '',
step1: step1:
'1. Click Close Button to make the Curtain run to Full Close and Position.', 'Click Close Button to make the Curtain run to Full Close and Position.',
step2: '2. click Next to complete the Calibration.', step2: 'click Next to complete the Calibration.',
), ),
leftOnTap: () => Navigator.of(parentContext).pop(), leftOnTap: () => Navigator.of(parentContext).pop(),
rightOnTap: () { rightOnTap: () {

4
lib/pages/device_managment/curtain_module/widgets/accurate_calibration_dialog.dart
View File

@ -20,8 +20,8 @@ class AccurateCalibrationDialog extends StatelessWidget {
title: 'Accurate Calibration', title: 'Accurate Calibration',
body: const NormalTextBodyForDialog( body: const NormalTextBodyForDialog(
title: 'Prepare Calibration:', title: 'Prepare Calibration:',
step1: '1. Run The Curtain to the Fully Open Position,and pause.', step1: 'Run The Curtain to the Fully Open Position,and pause.',
step2: '2. click Next to Start accurate calibration.', step2: 'click Next to Start accurate calibration.',
), ),
leftOnTap: () => Navigator.of(parentContext).pop(), leftOnTap: () => Navigator.of(parentContext).pop(),
rightOnTap: () { rightOnTap: () {

131
lib/pages/device_managment/curtain_module/widgets/accurate_dialog_widget.dart
View File

@ -17,78 +17,87 @@ class AccurateDialogWidget extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return SizedBox( return SizedBox(
height: 300, height: 250,
width: 400, width: 500,
child: Column( child: Column(
children: [ children: [
Padding( Expanded(
padding: const EdgeInsets.all(10), child: Column(
child: Text( children: [
title, Padding(
style: const TextStyle( padding: const EdgeInsets.all(10),
fontSize: 24, child: Text(
fontWeight: FontWeight.bold, title,
color: ColorsManager.blueColor, style: TextStyle(
), fontSize: 24,
fontWeight: FontWeight.bold,
color: ColorsManager.dialogBlueTitle,
),
),
),
const Divider(
indent: 60,
endIndent: 60,
),
],
), ),
), ),
const SizedBox(height: 5), Expanded(
const Divider(
indent: 10,
endIndent: 10,
),
Padding(
padding: const EdgeInsets.all(10),
child: body, child: body,
), ),
const SizedBox(height: 20), Expanded(
const Spacer(), child: Column(
const Divider(), mainAxisAlignment: MainAxisAlignment.end,
Row( children: [
children: [ const Divider(),
Expanded( Row(
child: InkWell( children: [
onTap: leftOnTap, Expanded(
child: Container( child: InkWell(
height: 60, onTap: leftOnTap,
alignment: Alignment.center, child: Container(
decoration: const BoxDecoration( height: 40,
border: Border( alignment: Alignment.center,
right: BorderSide( decoration: const BoxDecoration(
color: ColorsManager.grayBorder, border: Border(
right: BorderSide(
color: ColorsManager.grayBorder,
),
),
),
child: const Text(
'Cancel',
style: TextStyle(color: ColorsManager.grayBorder),
),
), ),
), ),
), ),
child: const Text( Expanded(
'Cancel', child: InkWell(
style: TextStyle(color: ColorsManager.grayBorder), onTap: rightOnTap,
), child: Container(
), height: 40,
), alignment: Alignment.center,
), decoration: const BoxDecoration(
Expanded( border: Border(
child: InkWell( right: BorderSide(
onTap: rightOnTap, color: ColorsManager.grayBorder,
child: Container( ),
height: 60, ),
alignment: Alignment.center, ),
decoration: const BoxDecoration( child: const Text(
border: Border( 'Next',
right: BorderSide( style: TextStyle(
color: ColorsManager.grayBorder, color: ColorsManager.blueColor,
),
),
), ),
), ),
), )
child: const Text( ],
'Next', )
style: TextStyle( ],
color: ColorsManager.blueColor, ),
),
),
),
),
)
],
) )
], ],
), ),

96
lib/pages/device_managment/curtain_module/widgets/calibrate_completed_dialog.dart
View File

@ -1,7 +1,9 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/svg.dart';
import 'package:syncrow_web/pages/device_managment/curtain_module/bloc/curtain_module_bloc.dart'; import 'package:syncrow_web/pages/device_managment/curtain_module/bloc/curtain_module_bloc.dart';
import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
class CalibrateCompletedDialog extends StatelessWidget { class CalibrateCompletedDialog extends StatelessWidget {
final BuildContext parentContext; final BuildContext parentContext;
@ -21,52 +23,62 @@ class CalibrateCompletedDialog extends StatelessWidget {
width: 400, width: 400,
child: Column( child: Column(
children: [ children: [
const Padding( Expanded(
padding: EdgeInsets.all(10), child: Column(
child: Text( children: [
'Calibration Completed', Padding(
style: TextStyle( padding: const EdgeInsets.all(10),
fontSize: 24, child: Text(
fontWeight: FontWeight.bold, 'Calibration Completed',
color: ColorsManager.blueColor, style: TextStyle(
), fontSize: 24,
fontWeight: FontWeight.bold,
color: ColorsManager.dialogBlueTitle,
),
),
),
const SizedBox(height: 5),
const Divider(
indent: 10,
endIndent: 10,
),
],
), ),
), ),
const SizedBox(height: 5), Expanded(
const Divider( child: SvgPicture.asset(Assets.completedDoneIcon),
indent: 10,
endIndent: 10,
), ),
const Icon( Expanded(
Icons.check_circle, child: Column(
size: 100, mainAxisAlignment: MainAxisAlignment.end,
color: ColorsManager.blueColor, children: [
), const Divider(
const Spacer(), indent: 10,
const Divider( endIndent: 10,
indent: 10,
endIndent: 10,
),
InkWell(
onTap: () {
parentContext.read<CurtainModuleBloc>().add(
FetchCurtainModuleStatusEvent(
deviceId: deviceId,
),
);
Navigator.of(parentContext).pop();
Navigator.of(parentContext).pop();
},
child: Container(
height: 40,
width: double.infinity,
alignment: Alignment.center,
child: const Text(
'Close',
style: TextStyle(
color: ColorsManager.grayBorder,
), ),
), InkWell(
onTap: () {
parentContext.read<CurtainModuleBloc>().add(
FetchCurtainModuleStatusEvent(
deviceId: deviceId,
),
);
Navigator.of(parentContext).pop();
Navigator.of(parentContext).pop();
},
child: Container(
height: 40,
width: double.infinity,
alignment: Alignment.center,
child: const Text(
'Close',
style: TextStyle(
color: ColorsManager.grayBorder,
),
),
),
)
],
), ),
) )
], ],

86
lib/pages/device_managment/curtain_module/widgets/normal_text_body_for_dialog.dart
View File

@ -15,28 +15,72 @@ class NormalTextBodyForDialog extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Column( return Padding(
crossAxisAlignment: CrossAxisAlignment.start, padding: EdgeInsetsGeometry.only(left: 15),
children: [ child: Column(
Text( crossAxisAlignment: CrossAxisAlignment.start,
title, children: [
style: const TextStyle( if (title.isEmpty)
color: ColorsManager.grayColor, const SizedBox()
else
Expanded(
child: Text(
title,
style: const TextStyle(
color: ColorsManager.grayColor,
fontSize: 17,
),
),
),
Expanded(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(
width: 10,
),
const Text('1. ',
style: TextStyle(
color: ColorsManager.grayColor,
fontSize: 17,
)),
SizedBox(
width: 450,
child: Text(
step1,
style: const TextStyle(
color: ColorsManager.grayColor,
fontSize: 17,
),
),
),
],
),
), ),
), Expanded(
Text( child: Row(
step1, crossAxisAlignment: CrossAxisAlignment.start,
style: const TextStyle( children: [
color: ColorsManager.grayColor, const SizedBox(
), width: 10,
), ),
Text( const Text('2. ',
step2, style: TextStyle(
style: const TextStyle( color: ColorsManager.grayColor,
color: ColorsManager.grayColor, fontSize: 17,
), )),
) Text(
], step2,
style: const TextStyle(
color: ColorsManager.grayColor,
fontSize: 17,
),
),
],
),
)
],
),
); );
} }
} }

2
lib/pages/device_managment/curtain_module/widgets/number_input_textfield.dart
View File

@ -19,7 +19,7 @@ class NumberInputField extends StatelessWidget {
contentPadding: EdgeInsets.zero, contentPadding: EdgeInsets.zero,
), ),
style: const TextStyle( style: const TextStyle(
fontSize: 20, fontSize: 15,
color: ColorsManager.blackColor, color: ColorsManager.blackColor,
), ),
); );

2
lib/pages/device_managment/curtain_module/widgets/pref_revers_card_widget.dart
View File

@ -18,7 +18,7 @@ class PrefReversCardWidget extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return DefaultContainer( return DefaultContainer(
padding: const EdgeInsets.all(12), padding: const EdgeInsets.all(18),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,

6
lib/pages/device_managment/curtain_module/widgets/prefrences_dialog.dart
View File

@ -23,12 +23,12 @@ class CurtainModulePrefrencesDialog extends StatelessWidget {
Widget build(_) { Widget build(_) {
return AlertDialog( return AlertDialog(
backgroundColor: ColorsManager.CircleImageBackground, backgroundColor: ColorsManager.CircleImageBackground,
contentPadding: const EdgeInsets.all(30), contentPadding: const EdgeInsets.all(20),
title: const Center( title: Center(
child: Text( child: Text(
'Preferences', 'Preferences',
style: TextStyle( style: TextStyle(
color: ColorsManager.blueColor, color: ColorsManager.dialogBlueTitle,
fontSize: 24, fontSize: 24,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),

102
lib/pages/device_managment/curtain_module/widgets/quick_calibrating_dialog.dart
View File

@ -69,49 +69,71 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
body: Column( body: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Text( const Expanded(
'1. please Enter the Travel Time:', child: Align(
style: TextStyle(color: ColorsManager.grayBorder), alignment: Alignment.center,
), child: Padding(
const SizedBox(height: 10), padding: EdgeInsets.only(right: 75),
Container( child: Text(
width: 150, '1.please Enter the Travel Time:',
height: 40, style: TextStyle(color: ColorsManager.lightGrayColor),
padding: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(12),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: NumberInputField(controller: _controller),
),
const Expanded(
child: Text(
'seconds',
style: TextStyle(
fontSize: 15,
color: ColorsManager.blueColor,
fontWeight: FontWeight.bold,
),
),
),
],
),
),
if (_errorText != null)
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Text(
_errorText!,
style: const TextStyle(
color: ColorsManager.red,
fontSize: 14,
), ),
), ),
), ),
),
Expanded(
child: Align(
alignment: Alignment.center,
child: Container(
width: 110,
padding: const EdgeInsets.all(5),
decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(12),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: NumberInputField(controller: _controller),
),
Expanded(
child: Text(
'seconds',
style: TextStyle(
fontSize: 12,
color: ColorsManager.dialogBlueTitle,
fontWeight: FontWeight.bold,
),
),
),
],
),
),
),
),
if (_errorText != null)
Expanded(
child: Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Text(
_errorText!,
style: const TextStyle(
color: ColorsManager.red,
fontSize: 14,
),
),
),
),
const Expanded(
child: Align(
alignment: Alignment.center,
child: Text(
'2.click Next to Complete the calibration',
style: TextStyle(color: ColorsManager.lightGrayColor),
),
),
)
], ],
), ),
leftOnTap: () => Navigator.of(widget.parentContext).pop(), leftOnTap: () => Navigator.of(widget.parentContext).pop(),

4
lib/pages/device_managment/curtain_module/widgets/quick_calibration_dialog.dart
View File

@ -23,8 +23,8 @@ class QuickCalibrationDialog extends StatelessWidget {
body: const NormalTextBodyForDialog( body: const NormalTextBodyForDialog(
title: 'Prepare Calibration:', title: 'Prepare Calibration:',
step1: step1:
'1. Confirm that the curtain is in the fully closed and suspended state.', 'Confirm that the curtain is in the fully closed and suspended state.',
step2: '2. click Next to Start calibration.', step2: 'click Next to Start calibration.',
), ),
leftOnTap: () => Navigator.of(parentContext).pop(), leftOnTap: () => Navigator.of(parentContext).pop(),
rightOnTap: () { rightOnTap: () {

4
lib/utils/color_manager.dart
View File

@ -83,7 +83,5 @@ abstract class ColorsManager {
static const Color maxPurpleDot = Color(0xFF5F00BD); static const Color maxPurpleDot = Color(0xFF5F00BD);
static const Color minBlue = Color(0xFF93AAFD); static const Color minBlue = Color(0xFF93AAFD);
static const Color minBlueDot = Color(0xFF023DFE); static const Color minBlueDot = Color(0xFF023DFE);
static const Color grey25 = Color(0xFFF9F9F9); static const Color grey25 = Color(0xFFF9F9F9);
} }

4
lib/utils/constants/assets.dart
View File

@ -394,6 +394,7 @@ class Assets {
static const String emptyBox = 'assets/icons/empty_box.png'; static const String emptyBox = 'assets/icons/empty_box.png';
static const String completeProcessIcon = static const String completeProcessIcon =
'assets/icons/compleate_process_icon.svg'; 'assets/icons/compleate_process_icon.svg';
static const String completedDoneIcon = 'assets/images/completed_done.svg';
static const String currentProcessIcon = static const String currentProcessIcon =
'assets/icons/current_process_icon.svg'; 'assets/icons/current_process_icon.svg';
static const String uncomplete_ProcessIcon = static const String uncomplete_ProcessIcon =
@ -505,5 +506,6 @@ class Assets {
static const String aqiAirQuality = 'assets/icons/aqi_air_quality.svg'; static const String aqiAirQuality = 'assets/icons/aqi_air_quality.svg';
static const String temperatureAqiSidebar = 'assets/icons/thermometer.svg'; static const String temperatureAqiSidebar = 'assets/icons/thermometer.svg';
static const String humidityAqiSidebar = 'assets/icons/humidity.svg'; static const String humidityAqiSidebar = 'assets/icons/humidity.svg';
static const String autocadOccupancyImage = 'assets/images/autocad_occupancy_image.png'; static const String autocadOccupancyImage =
'assets/images/autocad_occupancy_image.png';
} }