mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 15:17:31 +00:00
Refactor SpaceDetailsWidgets: Simplify layout and improve responsiveness in SpaceDetailsDevicesBox and SpaceSubSpacesBox. Update SpaceDetailsForm to enhance dialog width for better user experience. This refactor enhances maintainability and aligns with Clean Architecture principles.
This commit is contained in:
@ -4,7 +4,6 @@ import 'package:syncrow_web/pages/space_management_v2/modules/space_details/doma
|
|||||||
import 'package:syncrow_web/pages/space_management_v2/modules/space_details/presentation/widgets/button_content_widget.dart';
|
import 'package:syncrow_web/pages/space_management_v2/modules/space_details/presentation/widgets/button_content_widget.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';
|
import 'package:syncrow_web/utils/constants/assets.dart';
|
||||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
|
||||||
|
|
||||||
class SpaceDetailsDevicesBox extends StatelessWidget {
|
class SpaceDetailsDevicesBox extends StatelessWidget {
|
||||||
const SpaceDetailsDevicesBox({super.key, required this.space});
|
const SpaceDetailsDevicesBox({super.key, required this.space});
|
||||||
@ -13,78 +12,75 @@ class SpaceDetailsDevicesBox extends StatelessWidget {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Column(
|
if (space.productAllocations.isNotEmpty ||
|
||||||
children: [
|
space.subspaces.any((subspace) => subspace.productAllocations.isNotEmpty)) {
|
||||||
if (space.productAllocations.isNotEmpty ||
|
return Container(
|
||||||
space.subspaces
|
width: double.infinity,
|
||||||
.any((subspace) => subspace.productAllocations.isNotEmpty))
|
padding: const EdgeInsets.all(8.0),
|
||||||
SizedBox(
|
decoration: BoxDecoration(
|
||||||
width: context.screenWidth * 0.25,
|
color: ColorsManager.textFieldGreyColor,
|
||||||
child: Container(
|
borderRadius: BorderRadius.circular(15),
|
||||||
padding: const EdgeInsets.all(8.0),
|
border: Border.all(
|
||||||
decoration: BoxDecoration(
|
color: ColorsManager.textFieldGreyColor,
|
||||||
color: ColorsManager.textFieldGreyColor,
|
width: 3.0, // Border width
|
||||||
borderRadius: BorderRadius.circular(15),
|
),
|
||||||
border: Border.all(
|
),
|
||||||
color: ColorsManager.textFieldGreyColor,
|
child: Wrap(
|
||||||
width: 3.0, // Border width
|
spacing: 8.0,
|
||||||
),
|
runSpacing: 8.0,
|
||||||
),
|
children: [
|
||||||
child: Wrap(
|
// Combine tags from spaceModel and subspaces
|
||||||
spacing: 8.0,
|
// ...TagHelper.groupTags([
|
||||||
runSpacing: 8.0,
|
// ...?tags,
|
||||||
children: [
|
// ...?subspaces?.expand((subspace) => subspace.tags ?? [])
|
||||||
// Combine tags from spaceModel and subspaces
|
// ]).entries.map(
|
||||||
// ...TagHelper.groupTags([
|
// (entry) => Chip(
|
||||||
// ...?tags,
|
// avatar: SizedBox(
|
||||||
// ...?subspaces?.expand((subspace) => subspace.tags ?? [])
|
// width: 24,
|
||||||
// ]).entries.map(
|
// height: 24,
|
||||||
// (entry) => Chip(
|
// child: SvgPicture.asset(
|
||||||
// avatar: SizedBox(
|
// entry.key.icon ?? 'assets/icons/gateway.svg',
|
||||||
// width: 24,
|
// fit: BoxFit.contain,
|
||||||
// height: 24,
|
// ),
|
||||||
// child: SvgPicture.asset(
|
// ),
|
||||||
// entry.key.icon ?? 'assets/icons/gateway.svg',
|
// label: Text(
|
||||||
// fit: BoxFit.contain,
|
// 'x${entry.value}', // Show count
|
||||||
// ),
|
// style: Theme.of(context)
|
||||||
// ),
|
// .textTheme
|
||||||
// label: Text(
|
// .bodySmall
|
||||||
// 'x${entry.value}', // Show count
|
// ?.copyWith(color: ColorsManager.spaceColor),
|
||||||
// style: Theme.of(context)
|
// ),
|
||||||
// .textTheme
|
// backgroundColor: ColorsManager.whiteColors,
|
||||||
// .bodySmall
|
// shape: RoundedRectangleBorder(
|
||||||
// ?.copyWith(color: ColorsManager.spaceColor),
|
// borderRadius: BorderRadius.circular(16),
|
||||||
// ),
|
// side: const BorderSide(
|
||||||
// backgroundColor: ColorsManager.whiteColors,
|
// color: ColorsManager.spaceColor,
|
||||||
// shape: RoundedRectangleBorder(
|
// ),
|
||||||
// borderRadius: BorderRadius.circular(16),
|
// ),
|
||||||
// side: const BorderSide(
|
// ),
|
||||||
// color: ColorsManager.spaceColor,
|
// ),
|
||||||
// ),
|
|
||||||
// ),
|
|
||||||
// ),
|
|
||||||
// ),
|
|
||||||
|
|
||||||
EditChip(
|
EditChip(
|
||||||
onTap: () {},
|
onTap: () {},
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
)
|
],
|
||||||
else
|
),
|
||||||
TextButton(
|
);
|
||||||
onPressed: () {},
|
} else {
|
||||||
style: TextButton.styleFrom(
|
return TextButton(
|
||||||
padding: EdgeInsets.zero,
|
onPressed: () {},
|
||||||
),
|
style: TextButton.styleFrom(
|
||||||
child: const ButtonContentWidget(
|
padding: EdgeInsets.zero,
|
||||||
svgAssets: Assets.addIcon,
|
),
|
||||||
label: 'Add Devices',
|
child: const SizedBox(
|
||||||
// disabled: isTagsAndSubspaceModelDisabled,
|
width: double.infinity,
|
||||||
),
|
child: ButtonContentWidget(
|
||||||
)
|
svgAssets: Assets.addIcon,
|
||||||
],
|
label: 'Add Devices',
|
||||||
);
|
// disabled: isTagsAndSubspaceModelDisabled,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -34,6 +34,7 @@ class SpaceDetailsForm extends StatelessWidget {
|
|||||||
backgroundColor: ColorsManager.whiteColors,
|
backgroundColor: ColorsManager.whiteColors,
|
||||||
content: SizedBox(
|
content: SizedBox(
|
||||||
height: context.screenHeight * 0.3,
|
height: context.screenHeight * 0.3,
|
||||||
|
width: context.screenWidth * 0.5,
|
||||||
child: Row(
|
child: Row(
|
||||||
spacing: 20,
|
spacing: 20,
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
@ -8,7 +8,6 @@ import 'package:syncrow_web/pages/space_management_v2/modules/space_details/pres
|
|||||||
import 'package:syncrow_web/pages/space_management_v2/modules/update_space/presentation/bloc/space_details_model_bloc/space_details_model_bloc.dart';
|
import 'package:syncrow_web/pages/space_management_v2/modules/update_space/presentation/bloc/space_details_model_bloc/space_details_model_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';
|
import 'package:syncrow_web/utils/constants/assets.dart';
|
||||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
|
||||||
|
|
||||||
class SpaceSubSpacesBox extends StatelessWidget {
|
class SpaceSubSpacesBox extends StatelessWidget {
|
||||||
const SpaceSubSpacesBox({super.key, required this.subspaces});
|
const SpaceSubSpacesBox({super.key, required this.subspaces});
|
||||||
@ -17,50 +16,45 @@ class SpaceSubSpacesBox extends StatelessWidget {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Column(
|
if (subspaces.isEmpty) {
|
||||||
children: [
|
return TextButton(
|
||||||
if (subspaces.isEmpty)
|
style: TextButton.styleFrom(
|
||||||
TextButton(
|
padding: EdgeInsets.zero,
|
||||||
style: TextButton.styleFrom(
|
overlayColor: ColorsManager.transparentColor,
|
||||||
padding: EdgeInsets.zero,
|
),
|
||||||
overlayColor: ColorsManager.transparentColor,
|
onPressed: () => _showSubSpacesDialog(context),
|
||||||
),
|
child: const SizedBox(
|
||||||
onPressed: () => _showSubSpacesDialog(context),
|
width: double.infinity,
|
||||||
child: const ButtonContentWidget(
|
child: ButtonContentWidget(
|
||||||
svgAssets: Assets.addIcon,
|
svgAssets: Assets.addIcon,
|
||||||
label: 'Create Sub Spaces',
|
label: 'Create Sub Spaces',
|
||||||
disabled: false,
|
|
||||||
),
|
|
||||||
)
|
|
||||||
else
|
|
||||||
SizedBox(
|
|
||||||
width: context.screenWidth * 0.25,
|
|
||||||
child: Container(
|
|
||||||
padding: const EdgeInsets.all(8.0),
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: ColorsManager.textFieldGreyColor,
|
|
||||||
borderRadius: BorderRadius.circular(15),
|
|
||||||
border: Border.all(
|
|
||||||
color: ColorsManager.textFieldGreyColor,
|
|
||||||
width: 3.0,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
child: Wrap(
|
|
||||||
spacing: 8.0,
|
|
||||||
runSpacing: 8.0,
|
|
||||||
children: [
|
|
||||||
...subspaces.map(
|
|
||||||
(e) => SubspaceNameDisplayWidget(subSpace: e),
|
|
||||||
),
|
|
||||||
EditChip(
|
|
||||||
onTap: () => _showSubSpacesDialog(context),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
],
|
),
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
return Container(
|
||||||
|
padding: const EdgeInsets.all(8.0),
|
||||||
|
width: double.infinity,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
color: ColorsManager.textFieldGreyColor,
|
||||||
|
borderRadius: BorderRadius.circular(15),
|
||||||
|
border: Border.all(
|
||||||
|
color: ColorsManager.textFieldGreyColor,
|
||||||
|
width: 3.0,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
child: Wrap(
|
||||||
|
spacing: 8.0,
|
||||||
|
runSpacing: 8.0,
|
||||||
|
children: [
|
||||||
|
...subspaces.map((e) => SubspaceNameDisplayWidget(subSpace: e)),
|
||||||
|
EditChip(
|
||||||
|
onTap: () => _showSubSpacesDialog(context),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
void _showSubSpacesDialog(BuildContext context) {
|
void _showSubSpacesDialog(BuildContext context) {
|
||||||
|
Reference in New Issue
Block a user