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

Fixed design issues, added tag and location to the save dialog

Browse Source
This commit is contained in:
Abdullah Alassaf
2025-04-16 03:46:10 +03:00
parent db1f29e2b2
commit d4a7dd5854
7 changed files with 311 additions and 274 deletions
Download Patch File Download Diff File Expand all files Collapse all files

176
lib/pages/routines/helper/save_routine_helper.dart
View File

@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart';
import 'package:syncrow_web/pages/routines/models/device_functions.dart';
import 'package:syncrow_web/pages/routines/widgets/dialog_header.dart';
import 'package:syncrow_web/pages/routines/widgets/dialog_footer.dart';
import 'package:syncrow_web/utils/color_manager.dart';
@ -20,7 +21,7 @@ class SaveRoutineHelper {
return AlertDialog(
contentPadding: EdgeInsets.zero,
content: Container(
width: 600,
width: MediaQuery.sizeOf(context).width * 0.5,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(20),
@ -30,14 +31,15 @@ class SaveRoutineHelper {
children: [
DialogHeader('Create a scene: ${state.routineName ?? ""}'),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Left side - IF
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
child: ListView(
// crossAxisAlignment: CrossAxisAlignment.start,
shrinkWrap: true,
children: [
const Text(
'IF:',
@ -59,26 +61,7 @@ class SaveRoutineHelper {
...state.ifItems.map((item) {
final functions =
state.selectedFunctions[item['uniqueCustomId']] ?? [];
return ListTile(
leading: SvgPicture.asset(
item['imagePath'],
width: 22,
height: 22,
),
title:
Text(item['title'], style: const TextStyle(fontSize: 14)),
subtitle: Wrap(
children: functions
.map((f) => Text(
'${f.operationName}: ${f.value}, ',
style: const TextStyle(
color: ColorsManager.grayColor, fontSize: 8),
overflow: TextOverflow.ellipsis,
maxLines: 3,
))
.toList(),
),
);
return functionRow(item, context, functions);
}),
],
),
@ -87,8 +70,9 @@ class SaveRoutineHelper {
// Right side - THEN items
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
child: ListView(
// crossAxisAlignment: CrossAxisAlignment.start,
shrinkWrap: true,
children: [
const Text(
'THEN:',
@ -100,37 +84,7 @@ class SaveRoutineHelper {
...state.thenItems.map((item) {
final functions =
state.selectedFunctions[item['uniqueCustomId']] ?? [];
return ListTile(
leading: item['type'] == 'tap_to_run' || item['type'] == 'scene'
? Image.memory(
base64Decode(item['icon']),
width: 22,
height: 22,
)
: SvgPicture.asset(
item['imagePath'],
width: 22,
height: 22,
),
title: Text(
item['title'],
style: context.textTheme.bodySmall?.copyWith(
fontSize: 14,
color: ColorsManager.grayColor,
),
),
subtitle: Wrap(
children: functions
.map((f) => Text(
'${f.operationName}: ${f.value}, ',
style: context.textTheme.bodySmall?.copyWith(
color: ColorsManager.grayColor, fontSize: 8),
overflow: TextOverflow.ellipsis,
maxLines: 3,
))
.toList(),
),
);
return functionRow(item, context, functions);
}),
],
),
@ -177,4 +131,112 @@ class SaveRoutineHelper {
},
);
}
static Widget functionRow(
dynamic item, BuildContext context, List<DeviceFunctionData> functions) {
return Padding(
padding: const EdgeInsets.only(top: 6),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
spacing: 8,
children: [
item['type'] == 'tap_to_run' || item['type'] == 'scene'
? Image.memory(
base64Decode(item['icon']),
width: 22,
height: 22,
)
: SvgPicture.asset(
item['imagePath'],
width: 22,
height: 22,
),
Flexible(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
spacing: 2,
children: [
Text(
item['title'],
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: context.textTheme.bodySmall?.copyWith(
fontSize: 14,
color: ColorsManager.textPrimaryColor,
),
),
Wrap(
children: functions
.map((f) => Text(
'${f.operationName}: ${f.value}',
style: context.textTheme.bodySmall
?.copyWith(color: ColorsManager.grayColor, fontSize: 8),
overflow: TextOverflow.ellipsis,
maxLines: 3,
))
.toList(),
),
],
),
),
],
),
),
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
spacing: 2,
children: [
Visibility(
visible: item['tag'] != null && item['tag'] != '',
child: Row(
spacing: 2,
children: [
SizedBox(width: 8, height: 8, child: SvgPicture.asset(Assets.deviceTagIcon)),
Text(
item['tag'] ?? '',
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: context.textTheme.bodySmall?.copyWith(
color: ColorsManager.lightGreyColor,
fontSize: 9,
fontWeight: FontWeight.w400,
),
),
],
),
),
Visibility(
visible: item['subSpace'] != null && item['subSpace'] != '',
child: Row(
spacing: 2,
children: [
SizedBox(
width: 8, height: 8, child: SvgPicture.asset(Assets.spaceLocationIcon)),
Text(
item['subSpace'] ?? '',
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: context.textTheme.bodySmall?.copyWith(
color: ColorsManager.lightGreyColor,
fontSize: 9,
fontWeight: FontWeight.w400,
),
),
],
),
),
],
),
],
),
);
}
}