Compare commits

..

5 Commits

Author SHA1 Message Date
a526fcbeee Merge branch 'dev' into SP-1660-fe-ui-enhancement-update-confirmation-dialog-on-create-visitor-password-flow 2025-06-29 16:10:43 +03:00
172e1d208a [FE] Preferences & Calibration (#312)
<!--
  Thanks for contributing!

Provide a description of your changes below and a general summary in the
title

Please look at the following checklist to ensure that your PR can be
accepted quickly:
-->

## Jira Ticket
[SP-1707](https://syncrow.atlassian.net/browse/SP-1707)

## Description

fix UI  like in figma

## Type of Change

<!--- Put an `x` in all the boxes that apply: -->

- [ ]  New feature (non-breaking change which adds functionality)
- [x] 🛠️ Bug fix (non-breaking change which fixes an issue)
- [ ]  Breaking change (fix or feature that would cause existing
functionality to change)
- [ ] 🧹 Code refactor
- [ ]  Build configuration change
- [ ] 📝 Documentation
- [ ] 🗑️ Chore 


[SP-1707]:
https://syncrow.atlassian.net/browse/SP-1707?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ
2025-06-29 16:10:00 +03:00
2c254c1a91 Sp 1771 fe device name and subspace changes not reflected immediately after update on device management page (#313)
<!--
  Thanks for contributing!

Provide a description of your changes below and a general summary in the
title

Please look at the following checklist to ensure that your PR can be
accepted quickly:
-->

## Jira Ticket
[SP-1771](https://syncrow.atlassian.net/browse/SP-1771)

## Description

Synced state between settings and devices table.

## Type of Change

<!--- Put an `x` in all the boxes that apply: -->

- [ ]  New feature (non-breaking change which adds functionality)
- [x] 🛠️ Bug fix (non-breaking change which fixes an issue)
- [ ]  Breaking change (fix or feature that would cause existing
functionality to change)
- [ ] 🧹 Code refactor
- [ ]  Build configuration change
- [ ] 📝 Documentation
- [ ] 🗑️ Chore 


[SP-1771]:
https://syncrow.atlassian.net/browse/SP-1771?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ
2025-06-29 16:09:37 +03:00
354d61dfa2 UI Enhancement 2025-06-29 15:50:37 +03:00
814cbf787f edit the UI as wanted in ticket (note: in figma is not updated yet to the requested ticket) 2025-06-29 13:58:57 +03:00
13 changed files with 281 additions and 196 deletions

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: () {

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: () {

View File

@ -17,32 +17,38 @@ 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(
children: [
Expanded(
child: Column( child: Column(
children: [ children: [
Padding( Padding(
padding: const EdgeInsets.all(10), padding: const EdgeInsets.all(10),
child: Text( child: Text(
title, title,
style: const TextStyle( style: TextStyle(
fontSize: 24, fontSize: 24,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
color: ColorsManager.blueColor, color: ColorsManager.dialogBlueTitle,
), ),
), ),
), ),
const SizedBox(height: 5),
const Divider( const Divider(
indent: 10, indent: 60,
endIndent: 10, endIndent: 60,
), ),
Padding( ],
padding: const EdgeInsets.all(10), ),
),
Expanded(
child: body, child: body,
), ),
const SizedBox(height: 20), Expanded(
const Spacer(), child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
const Divider(), const Divider(),
Row( Row(
children: [ children: [
@ -50,7 +56,7 @@ class AccurateDialogWidget extends StatelessWidget {
child: InkWell( child: InkWell(
onTap: leftOnTap, onTap: leftOnTap,
child: Container( child: Container(
height: 60, height: 40,
alignment: Alignment.center, alignment: Alignment.center,
decoration: const BoxDecoration( decoration: const BoxDecoration(
border: Border( border: Border(
@ -70,7 +76,7 @@ class AccurateDialogWidget extends StatelessWidget {
child: InkWell( child: InkWell(
onTap: rightOnTap, onTap: rightOnTap,
child: Container( child: Container(
height: 60, height: 40,
alignment: Alignment.center, alignment: Alignment.center,
decoration: const BoxDecoration( decoration: const BoxDecoration(
border: Border( border: Border(
@ -92,6 +98,9 @@ class AccurateDialogWidget extends StatelessWidget {
) )
], ],
), ),
)
],
),
); );
} }
} }

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,14 +23,17 @@ class CalibrateCompletedDialog extends StatelessWidget {
width: 400, width: 400,
child: Column( child: Column(
children: [ children: [
const Padding( Expanded(
padding: EdgeInsets.all(10), child: Column(
children: [
Padding(
padding: const EdgeInsets.all(10),
child: Text( child: Text(
'Calibration Completed', 'Calibration Completed',
style: TextStyle( style: TextStyle(
fontSize: 24, fontSize: 24,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
color: ColorsManager.blueColor, color: ColorsManager.dialogBlueTitle,
), ),
), ),
), ),
@ -37,12 +42,16 @@ class CalibrateCompletedDialog extends StatelessWidget {
indent: 10, indent: 10,
endIndent: 10, endIndent: 10,
), ),
const Icon( ],
Icons.check_circle,
size: 100,
color: ColorsManager.blueColor,
), ),
const Spacer(), ),
Expanded(
child: SvgPicture.asset(Assets.completedDoneIcon),
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
const Divider( const Divider(
indent: 10, indent: 10,
endIndent: 10, endIndent: 10,
@ -71,6 +80,9 @@ class CalibrateCompletedDialog extends StatelessWidget {
) )
], ],
), ),
)
],
),
), ),
); );
} }

View File

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

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,
), ),
); );

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,

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,
), ),

View File

@ -69,14 +69,23 @@ 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(
padding: EdgeInsets.only(right: 75),
child: Text(
'1.please Enter the Travel Time:',
style: TextStyle(color: ColorsManager.lightGrayColor),
), ),
const SizedBox(height: 10), ),
Container( ),
width: 150, ),
height: 40, Expanded(
child: Align(
alignment: Alignment.center,
child: Container(
width: 110,
padding: const EdgeInsets.all(5), padding: const EdgeInsets.all(5),
decoration: BoxDecoration( decoration: BoxDecoration(
color: ColorsManager.whiteColors, color: ColorsManager.whiteColors,
@ -88,12 +97,12 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
Expanded( Expanded(
child: NumberInputField(controller: _controller), child: NumberInputField(controller: _controller),
), ),
const Expanded( Expanded(
child: Text( child: Text(
'seconds', 'seconds',
style: TextStyle( style: TextStyle(
fontSize: 15, fontSize: 12,
color: ColorsManager.blueColor, color: ColorsManager.dialogBlueTitle,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
), ),
@ -101,8 +110,11 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
], ],
), ),
), ),
),
),
if (_errorText != null) if (_errorText != null)
Padding( Expanded(
child: Padding(
padding: const EdgeInsets.only(top: 8.0), padding: const EdgeInsets.only(top: 8.0),
child: Text( child: Text(
_errorText!, _errorText!,
@ -112,6 +124,16 @@ class _QuickCalibratingDialogState extends State<QuickCalibratingDialog> {
), ),
), ),
), ),
),
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(),

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: () {

View File

@ -574,8 +574,9 @@ class VisitorPasswordDialog extends StatelessWidget {
} else { } else {
return AlertDialog( return AlertDialog(
alignment: Alignment.center, alignment: Alignment.center,
backgroundColor: Colors.white,
content: SizedBox( content: SizedBox(
height: size.height * 0.25, height: size.height * 0.13,
child: Column( child: Column(
children: [ children: [
Column( Column(
@ -589,11 +590,16 @@ class VisitorPasswordDialog extends StatelessWidget {
width: 35, width: 35,
), ),
), ),
const SizedBox(
height: 20,
),
Text( Text(
'Set Password', 'Set Password',
style: style: Theme.of(context)
Theme.of(context).textTheme.headlineLarge!.copyWith( .textTheme
fontSize: 30, .headlineLarge!
.copyWith(
fontSize: 24,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
color: Colors.black, color: Colors.black,
), ),
@ -601,15 +607,6 @@ class VisitorPasswordDialog extends StatelessWidget {
], ],
), ),
const SizedBox(width: 15), const SizedBox(width: 15),
Text(
'This action will update all of the selected\n door locks passwords in the property.\n\nAre you sure you want to continue?',
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
color: ColorsManager.grayColor,
fontWeight: FontWeight.w400,
fontSize: 18,
),
),
], ],
), ),
), ),
@ -638,6 +635,7 @@ class VisitorPasswordDialog extends StatelessWidget {
decoration: containerDecoration, decoration: containerDecoration,
width: size.width * 0.1, width: size.width * 0.1,
child: DefaultButton( child: DefaultButton(
backgroundColor: Color(0xff023DFE),
borderRadius: 8, borderRadius: 8,
onPressed: () { onPressed: () {
Navigator.pop(context); Navigator.pop(context);
@ -681,7 +679,7 @@ class VisitorPasswordDialog extends StatelessWidget {
} }
}, },
child: Text( child: Text(
'Ok', 'Confirm',
style: Theme.of(context).textTheme.bodySmall!.copyWith( style: Theme.of(context).textTheme.bodySmall!.copyWith(
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
color: ColorsManager.whiteColors, color: ColorsManager.whiteColors,

View File

@ -84,6 +84,4 @@ abstract class ColorsManager {
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);
} }

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';
} }